jQuery 文档操作

Posted 竹石2020

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery 文档操作相关的知识,希望对你有一定的参考价值。

属性操作

 1 attr(attrName)// 返回第一个匹配元素的属性值
 2 attr(attrName, attrValue)// 为所有匹配元素设置一个属性值
 3 attr({k1: v1, k2:v2})// 为所有匹配元素设置多个属性值
 4 removeAttr(attrName)// 从每一个匹配的元素中删除一个属性
 5 
 6 示例:
 7     设置单个属性
 8         $(‘.c1‘).attr(‘xx‘,‘oo‘);
 9     设置多个属性
10         $(‘.c1‘).attr({‘age‘:‘18‘,‘sex‘:‘alex‘});
11     查看属性
12         $(‘.c1‘).attr(‘属性名‘);
13         $(‘.c1‘).attr(‘xx‘);
14     删除属性
15         $(‘.c1‘).removeAttr(‘xx‘);
16 
17 prop -- 针对的是checkedselecteddisabled..
18 
19 查看标签是否有checked属性,也就是是否被选中
20         attr $(‘:checked‘).attr(‘checked‘); //checked -- undefined
21         prop $(‘:checked‘).prop(‘checked‘); //true  -- false
22         
23         通过设置属性的方式来设置是否选中:
24             $(‘:radio‘).eq(2).prop(‘checked‘,true);  true和false不能加引号
25             $(‘:radio‘).eq(2).prop(‘checked‘,false);
26 
27 简单总结:
28     1.对于标签上有的能看到的属性和自定义属性都用attr
29     2.对于返回布尔值的比如checkbox、radio和option的是否被选中或者设置其被选中与取消选中都用prop。
30     具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),其他的使用 attr()

文档处理

 1 添加到指定元素内部的后面
 2     $(A).append(B)// 把B追加到A
 3     $(A).appendTo(B)// 把A追加到B
 4     #添加字符串照样能识别标签  *****
 5     $(‘#d1‘).append(‘<a href="http://www.jd.com">京东</a>‘);
 6 添加到指定元素内部的前面
 7     $(A).prepend(B)// 把B前置到A
 8     $(A).prependTo(B)// 把A前置到B
 9     示例
10         $(‘a‘).prependTo($(‘div‘));
11 
12 添加到指定元素外部的后面
13     $(A).after(B)// 把B放到A的后面
14     $(A).insertAfter(B)// 把A放到B的后面
15 
16 添加到指定元素外部的前面
17     $(A).before(B)// 把B放到A的前面
18     $(A).insertBefore(B)// 把A放到B的前面
19     
20 移除和清空元素
21     remove()// 从DOM中删除所有匹配的元素。
22     empty()// 删除匹配的元素集合中所有的子节点,包括文本被全部删除,但是匹配的元素还
23     $(‘div‘).remove();
24     $(‘div‘).empty();
25 
26 替换
27     replaceWith()
28     replaceAll()
29     示例:
30         var a = document.createElement(‘a‘)
31         a.href = ‘http://www.baidu.com‘;
32         a.innerText = ‘xxx‘;
33         
34         $(‘span‘).replaceWith(a);
35         $(a).replaceAll(‘span‘);
36         
37 clone()克隆
38     <button class="btn">屠龙宝刀,点击就送!</button>    
39 
40     $(‘.btn‘).click(function () {
41         // var a = $(this).clone(); //克隆标签
42         var a = $(this).clone(true);  //连带事件一起克隆
43         $(this).after(a);
44 
45     })

 

以上是关于jQuery 文档操作的主要内容,如果未能解决你的问题,请参考以下文章

jQuery的DOM操作

[ jquery 文档处理 insertBefore(content) before(content|fn) ] 此方法用于把所有匹配的元素插入到另一个指定的元素元素集合的前面,实现外部插入(代码片段

jquery基本操作

jQuery应用 代码片段

Visual Studio 2012-2019的130多个jQuery代码片段。

markdown 在WordPress中使用jQuery代码片段