jQuery小知识2

Posted 2021-12-20 Thuri

3.跟表单相关的选择元素：表单相关前面都加一个冒号

选择表单中所有的input元素：    $(\':input\')，注意这里的button按钮也被看成是input元素
$(\':button\') 找到的就是页面上所有的重置按钮和注册按钮
$(\':submit\') 找到所有的提交类型的按钮
$(\':reset\') 选择所有的重置按钮
一切的表单元素都可以使用:元素名称/类型名称
$(\':file\')选择文件类型的元素
$(\'checkbox\')选择复选框
$(\'password\')选择密码
$(\':radio\')
$(\':checked\')
$(\':focus\')处于焦点状态的表单元素
$(\':disabled\')禁用的表单元素
$(\':eabled\')启用的表单元素

4.孩子，兄弟，父亲元素们

选择第一个子元素是first-child，与first有区别，first选择的是第一个元素
last-child选择最后一个子元素
nth-child允许我们选择指定的子元素，nth-child是从1开始的，与eq不同，eq是从0开始的
nth-chid(1)选择第一个子元素
nth-child(odd)奇数位置的子元素
nth-child(even)偶数位置的子元素
nth-child(4n)选择4的倍数的子元素
nth-last-child(4n)倒着数4n的倍数
contains()可以选择包含某些字符串的元素，包含的是文字内容
$(\'li:contains("viva")\');
$(\'li img\').first()
$(\'li img\').last()
$(\'li img\').slice(4,8)选择开始到结束的位置的值
$(\'li\').children(\'h2\');选择子元素里的h2元素
$(\'li").parent()也可以选择一个元素的父亲元素
$(\'li\').next()选择这个元素的下一个兄弟元素
$(\'li\').prev()选择上一个兄弟元素
$(\'li\').siblings()选择所有的兄弟元素
$(\'li\').nextAll()可以选择后边所有的兄弟元素
$(\'li\').prevAll()
$(document).bind("click",function(e)   // 匹配最近的元素，如果没有就向上找，如果找不到就返回一个空jQuery对象
    $(e.target).closest(\'li\').css("color","red");
)
children()方法只考虑子元素，不考虑其他后代元素