jquery知识点结合使用

1、在页面的某个具有id的element内插入其他element，并给其增加悬浮提示。

$('#id').after('<div id='box'></div>');  

$('#box').attr('title','beautiful')；

after() --在被选中的元素之后插入内容 

attr("attributeName",value) -- 为指定元素设置一个或多个属性，attributeName属性名，value 为这个属性设置的值

联想：append() --在被选元素的结尾插入内容

　　　before() --在被选元素之前插入内容

           prepend() --在被选元素的开头插入内容

 

2、获取单选框/复选框

//选中的name为identity单选框的value值
$("input[name=identity]:checked").val();  

//选中的单选框的value值
$("input[type='radio']:checked").val();

//获取被勾选的单选框对象
$('input[name="identity"]').filter(':checked');

//获取被勾选的复选框对象
$("input[type='checkbox']").filter(':checked')

//获取被勾选的复选框对象
$("input[type='checkbox']:checked").val([]);

 

3、遍历

$("input[name=identity]").each(function(i){
             alert($(this).val());    
    });

遍历name为identity的所有input对象，并且alert对应的value值

 

 4、看元素的某一属性是否包含某字符串，下面的class可以为其他属性，所需匹配的字符串也可根据实际情况而定。

$("div[class^="qwe"]")

筛选class以qwe为开头的所有div。

 

$("div[class$="qwe"]")

筛选class以qwe为结尾的所有div。

 

$("div[class*="qwe"]")

筛选class包含qwe的所有div。

 

5、jquery的clone() 方法

let newElem = $("div.cell").clone(true/false);

如果传参数true给clone方法，就会把时间处理函数级关联数据一并克隆到新目标元素。

若省略这个参数或者传false，就会忽略事件处理函数和关联数据。

6、

$('#only').find(':nth-child(1)') 　　----id为only的元素的第一个子元素,n也同理
$('#only').find(':nth-last-child(2)') 　----class为only的元素的倒数第一个子元素
$('#only').find(':last-child') 　　　　----class为only的元素的倒数第一个子元素
$('div').not('.only')  ----所有class不为only的div