jquery之再次出发2

jQery选择器

学会看手册才是王道啊

选择器是jQery的根基,在jQery中,对事件处理,遍历DOM和Ajax操作都依赖于选择器,而无需担心浏览器是否支持这一选择器

  • 完善的处理机制:即使用jQuery获取网页中不存在的元素也不会报错

  • $(“#tt) 获取的永远是对象,即使网页上没有此元素

因此当用jQery检查某个元素在网页上是否存在时 应根据获取到元素的长度来判断或转化为DOM对象

if($("#tt")){ } //不能使用以下代码

if($("#tt").length) > 0{ } //yes!
if($("#tt")[0]){ }         //yes!

基本选择器

通过元素id,class和标签名等来查找DOM元素。在网页中,每个id名称只能使用一次,class允许重复使用

层次选择器

通过DOM元素之间的层次关系来获取特定元素,例如后代,子,相邻,同辈元素

选择器 描述 返回 示例
$(‘ancestor descendant’) 选取ancestor元素里的descendant【后代】元素 集合元素 $(‘div span’)选取div里的所有span
$(‘parent>chiild’) 选取parent元素下的child【子】元素【楼上选取的是后代】 集合元素 $(‘div>span’)选取div元素下元素名是span的子元素
$(“prev+next”)【next()】 紧接在prev元素后的next元素 集合元素 $(“.one+div”)选取class为one的下一个div同辈元素
$(“prev~siblings”)【nextAll()】 prev元素之后的所有siblings元素 集合元素 $(“#two~div”)选取id为two后面的所有div同辈元素

siblings()方法与前后位置无关,只要是同辈节点就能匹配

过滤选择器

通过特定的过滤规则来筛选出所需的DOM元素,过滤规则与CSS中的伪类选择器语法相同,以(:)开头

  • 内容过滤选择器
    过滤规则主要体现在它所包含的子元素或文本内容上

  • 可见性过滤选择器
    根据元素的可见和不可见状态来选择相应的元素

    • 属性选择过滤器
      通过元素的属性来获取

    • 子元素过滤选择器

    • 表单对象属性过滤选择器

    • 表单选择器

选择器注意事项

  • 选择器含有”#,(,[” 特殊字符
$("#id#b");    //no
$("#id\\#b");  //yes 转义!
  • 选择器含有空格,空格导致结果不同
    是后代选择器和过滤选择器的不同

var $t_a = $('.test :hidden'); //带空格---选取class为"test"的元素里面的隐藏元素

var $t_b = $('.test:hidden');  //没空格--选取class为"test"的元素
发布了52 篇原创文章 · 获赞 3 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/qq_26327971/article/details/63251479
今日推荐