jquery的读、写、增、删、查方法
# 注:jquery需要导包 格式<script type="text/javascript" src="jquery-3.2.1.js">></script>
1.读写节点html内容:
node.html(); // 读取节点里的所有内容(文本和标签等信息);
node.html( " " ); // 往该节点写入html内容,里面的内容会被覆盖。
eg: $("p").html("修改后");
2.读写节点文本内容
node.text();
node.text(" "); // 文本内容与html内容的区别在于文本内容只包含文本,没有其他html的元素(标签等)
3.增加节点: var p1=$( "<p>创建一个p节点</p>" );
4.插入节点:
parent.append(p1); //将p1节点作为最后一个子节点插入;
eg(例子):$("body").append(p1);
parent.prepend(p1); // 将p1节点作为第一个子节点插入;
brother.afetr(p1); //作为弟弟(同级下一个)节点插入
brother.afetr(p1); //作为哥哥(同级上一个)节点插入
5.删除节点:
node.remove(); // 删除节点
eg:$("p").remove();
node.remove(选择器); //删除满足选择器的节点
node.empty(); //删除节点的内容,但保留标签
6.样式操作
node.addClass(" "); //追加样式,参数中传入一个类
eg: $("p").addClass("size");
node.removeClass(" "); //移除指定样式
node.removeClass(); //移除所有样式
toggleClass(" "); //在设置和取消中切换
hasClass(" "); //判断是否有某个样式
node.css("","").css("","") ; //设置样式的值,可多个
7.遍历节点的操作
parent.children() / parent.children(选择器):访问直接的子节点
node.next(); // 访问下一个兄弟(同一个父类的同级元素)节点;
node.prev(); //访问上一个兄弟节点
node.sibling();// 访问所有的兄弟节点
node.find();// 查找所有后代节点
node.parent(); //查找父节点
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title><style type="text/html"> .size{ font-size:30px; }
</style>
</head>
<body>
<p>示范文本</p>
<img src="">
</body>
</html>
jquery的读、写、增、删、查方法的更多相关文章
- jQuery调用WebService实现增删改查的实现
第一篇博客,发下我自己写的jQuery调用WebService实现增删改查的实现. 1 <!DOCTYPE html> 2 3 <html xmlns="http://ww ...
- Spring Data CrudRepository增删改查方法(八)
CrudRepository 的主要方法 long count(); boolean exists(Integer arg0); <S extends StudentPO> S sav ...
- Django REST framework 五种增删改查方法
Django-DRF-视图的演变 版本一(基于类视图APIView类) views.py: APIView是继承的Django View视图的. 1 from .serializers impor ...
- 通用mapper的增删改查方法 留存 备忘
Mybatis通用Mapper介绍与使用 前言 使用Mybatis的开发者,大多数都会遇到一个问题,就是要写大量的SQL在xml文件中,除了特殊的业务逻辑SQL之外,还有大量结构类似的增删改查SQ ...
- PHP数据库的 增 删 查
一.匹配数据库登录 步骤: 1.做一个普通的登录界面,注意提交方式为post. <!--登录界面--> <form action="chuli.php" meth ...
- jquery 对select option 增删改查
一.查 jQuery获取select的Text和Value: 代码如下: 1.当select添加选择事件,当选择其中一项时触发: $("#select_id"). ...
- 关于单链表的增删改查方法的递归实现(JAVA语言实现)
因为在学习数据结构,准备把java的集合框架底层源码,好好的过一遍,所以先按照自己的想法把单链表的类给写出来了; 写该类的目的: 1.练习递归 2.为深入理解java集合框架底层源码打好基础 学习的视 ...
- jQuery之必会增删改查Dom操作
.next .prev <button>change</button> <span class = '.demo'>aaa</span> <p ...
- classLIST元素增删改查方法
window.onload=function () { var oDiv=document.getElementsByTagName('div')[0]; var oInP=document.getE ...
- [jQuery EasyUI系列] 创建增删改查应用
一.数据收集并妥善管理数据是网络应用共同的必要.CRUD允许我们生产页面列表并编辑数据库记录. 本文主要演示如何使用jQuery EasyUI实现CRUD DataGrid. 将使用到的插件有: da ...
随机推荐
- Redis原理详解
Redis原理详解 数据类型 Redis最为常用的数据类型主要有以下五种: String Hash List Set Sorted set 在具体描述这几种数据类型之前,我们先通过一张图了解下Redi ...
- matlab练习程序(快速搜索随机树RRT)
RRT快速搜索随机树英文全称Rapid-exploration Random Tree,和PRM类似,也是一种路径规划算法. 和PRM类似,算法也需要随机撒点,不过不同的是,该算法不是全局随机撒点,而 ...
- PHP使用ElasticSearch做搜索
PHP 使用 ElasticSearch 做搜索 https://blog.csdn.net/zhanghao143lina/article/details/80280321 https://www. ...
- maven详解 之仓库
Maven仓库分类 MAVEN仓库分类 Maven仓库分为:本地仓库+远程仓库两大类 远程仓库又分为:中央仓库+私服+其它公共远程仓库 1,在Maven中,任何一个依赖.插件或者项目构建的输出,都 ...
- 关于js中异步问题的解决方案
在js中有一个始终无法绕过的问题,如何优雅地解决异步问题.实际上,js在执行过程中,每遇到一个异步函数,都会将这个异步函数放入一个异步队列中,只有当同步线程执行结束之后,才会开始执行异步队列中的函数, ...
- 七、Vue组件库:Element、Swiper(轮播专用组件)
一.vue的Element组件库 官网:https://element.eleme.cn/#/zh-CN 1.1安装 推荐安装方法: 首先要进入项目目录 cnpm i element-ui -S 或 ...
- editplus的注册码 4.0
用户名:jb51.net 序列号:9A72F-84A30-82Z46-BFW79-4FTA8 用户名:freeuser 序列号:F15AD-12490-DAZF5-E4W30-E7T80 注册名:Fr ...
- Window Server 2019 配置篇(7)- 利用脚本创建OU,组和用户
好的,服务器到上一步为止,基本的雏形已经确立了,接下来我们要完善一些细节 打开AD-admin服务器,创建一个脚本,要求能够从csv文件中读出数据并建立OU,组和用户,以及他们的密码 这里有一个参考的 ...
- 开源DDD设计模式框架YMNNetCoreFrameWork第五篇-Swagger增加权限认证
配置文件services.AddSwaggerGen(c => { c.SwaggerDoc("v1", new OpenApiInfo { Version = " ...
- 九、JavaScript之分号使用,支持一行多语句
一.代码如下 二.执行效果如下 <!DOCTYPE html> <html> <meta http-equiv="Content-Type" cont ...