越来越少人用JQuery，但你就不学了吗？（3）
2021-01-26 08:16
阅读：475
YPE html>
标签：check ack sele script 创建元素 function cte ext color
如需要跟多资料请点击下方图片?（扫码加好友→备注66）
Jquery Dom操作
? jQuery也提供了对HTML节点的操作，而且在原生js的基础之上进行了优化，使用起来更加方便。
? 常用的从几个方面来操作，查找元素（选择器已经实现）；创建节点对象；访问和设置节点对象的值，以及属性；添加节点；删除节点；删除、添加、修改、设定节点的CSS样式等。注意：以下的操作方式只适用于jQuery对象。
操作元素的属性
获取属性
| 方法 | 说明 | 举例 |
|---|---|---|
| attr(属性名称) | 获取指定的属性值，操作 checkbox 时， 选中返回 checked，没有选中返回 undefined。 |
attr(‘checked‘) attr(‘name‘) |
| prop(属性名称) | 获取具有true和false两个属性的属性值 | prop(‘checked‘) |
设置属性
| 方法 | 说明 | 举例 |
|---|---|---|
| attr(属性名称，属性值) | 设置指定的属性值， 操作 checkbox 时， 选中返回 checked， 没有选中返回 undefined。 |
attr(‘checked‘,’checked’) attr(‘name‘,’zs’) |
| prop(属性名称，属性值) | 设置具有true和false的属性值 | prop(‘checked‘,’true’) |
移除属性
| 方法 | 说明 | 举例 |
|---|---|---|
| removeAttr(属性名) | 移除指定的属性 | removeAttr(‘checked‘) |
属性操作
1.attr()
设置或者返回元素的属性 ;
2.prop()
设置 具有 true 和 false 两个属性的属性，如 checked, selected 或者 disabled。
百度
新浪
全选
操作元素的样式
? 对于元素的样式，也是一种属性，由于样式用得特别多，所以对于样式除了当做属性处理外还可以有专门的方法进行处理。
| 方法 | 说明 |
|---|---|
| attr(“class”) | 获取class属性的值，即样式名称 |
| attr(“class”,”样式名”) | 修改class属性的值，修改样式 |
| addClass(“样式名”) | 添加样式名称 |
| css() | 添加具体的样式 |
| removeClass(class) | 移除样式名称 |
增加元素的具体样式，格式：
1）css({‘样式名’:’样式值’,’样式名2’:’样式值2’})
例：css({"background-color":"red","color":"#fff"});
2）css(“样式名”,”样式值”)
例：css(‘color‘,‘white‘)
设置元素样式
css()方法设置元素样式
天蓝色
大红色
天蓝色
操作元素的内容
? 对于元素还可以操作其中的内容，例如文本，值，甚至是html。
| 方法 | 说明 |
|---|---|
| html() | 获取元素的html内容 |
| html("html,内容") | 设定元素的html内容 |
| text() | 获取元素的文本内容，不包含html |
| text("text 内容") | 设置元素的文本内容，不包含html |
| val() | 获取元素value值 |
| val(‘值’) | 设定元素的value值 |
操作内容
html()和text()方法设置元素内容
创建元素
? 在jQuery中创建元素很简单，直接使用核心函数即可
$(‘元素内容’);
$(‘this is a paragraph!!!
‘);
添加元素
| 方法 | 说明 |
|---|---|
| prepend(content) | 在被选元素内部的开头插入元素或内容，被追加的 content 参数，可以是字符、HTML 元素标记。 |
| $(content).prependTo(selector) | 把 content 元素或内容加入 selector 元素开头 |
| append(content) | 在被选元素内部的结尾插入元素或内容，被追加的 content 参数，可以是字符、HTML 元素标记。 |
| $(content).appendTo(selector) | 把 content元素或内容插入selector 元素内，默认是在尾部 |
| before() | 在元素前插入指定的元素或内容:$(selector).before(content) |
| after() | 在元素后插入指定的元素或内容:$(selector).after(content) |
追加
prepend()方法前追加内容
prependTo()方法前追加内容
append()方法后追加内容
appendTo()方法后追加内容
男神
偶像
小鲜肉
插入元素
before() 和 after()方法在元素之前后插入内容
财大气粗
删除元素
| 方法 | 说明 |
|---|---|
| remove() | 删除所选元素或指定的子元素，包括整个标签和内容一起删。 |
| empty() | 清空所选元素的内容 |
删除元素
删除元素
jquery删除
javase
http协议
servlet
遍历元素
? each()
? $(selector).each(function(index,element)) :遍历元素
? 参数 function 为遍历时的回调函数，
? index 为遍历元素的序列号，从 0 开始。
? element是当前的元素，此时是dom元素。
遍历元素
遍历元素 each()
jquery
javase
http协议
servlet
越来越少人用JQuery，但你就不学了吗？（3）
标签：check ack sele script 创建元素 function cte ext color
原文地址：https://www.cnblogs.com/lezijie/p/13231171.html
文章来自：搜素材网的编程语言模块，转载请注明文章出处。
文章标题：越来越少人用JQuery，但你就不学了吗？（3）
文章链接：http://soscw.com/index.php/essay/47195.html
文章标题：越来越少人用JQuery，但你就不学了吗？（3）
文章链接：http://soscw.com/index.php/essay/47195.html
评论
亲，登录后才可以留言！