美文网首页
jquery选择器的使用

jquery选择器的使用

作者: 转身丶即天涯 | 来源:发表于2018-10-23 17:54 被阅读2次

选择DOM的方式

1.通过id选择
$('#id')

2.通过class选择
$('.class')
不推荐这种做法,class可能会有多个元素使用,不小心可能改到其他元素的class。
而且效率也比较低。

3.通过标签选择
比如选择所有div。$('div')

在比如选择<div id="m-div">中所有的<li id='li-id' class='li-cls'>:
可以这样('#m-div li'),也可以这样('#m-div #li-id'),还可以$('#m-div .li-cls')

那么这样就很灵活了,总结一下,jquery的选择器是逐级从左向右选择,可以自由组合,只要能准确定位到元素或者有一定属性的元素。

注意

jquery支持多种类型同时选择,在同时选择的时候需要注意,中间用逗号隔开。
比如,我想选择所有的<div>和<li>。
那么可以这样写$('div,li')

中间有空格代表的是逐级查找,中间用逗号表示同级查找。


按层选择

比如,我想取<div id='m-div'>下面的所有子<span>元素。

<div id="m-div">
        <span>span 1</span>
        <div>
                <span>span 2</span>
        </div>
</div>
<div></div>

('#m-div span')这样可以取到div下的所有span。('#m-div > span')这样就只能取到div下一级的span,里面那个span就不会被取到。
('#m-div + div')选取m-div的下一个div,换句话说就是:和m-div同级的下一个div。('#m-div ~ div')选取m-div之后的所有div元素。

有个哥们总结的更全面,传送门
吃点现成,哈哈。

相关文章

  • jQuery选择器

    jQuery选择器 jQuery选择器完全继承了CSS的风格。学会使用选择器是学习jQuery的基础,jQuery...

  • jQuery基础功能

    jQuery 如何获取元素 方法一:使用CSS选择器 方法二:使用jQuery自有的特殊选择器 jQuery 的链...

  • jquery的元素选择器

    jquery的元素选择器 jQuery选择器是使用封装好的sizzle库 示例

  • jQuery框架

    jQuery 选择器: 一、jQuery 使用 CSS 选择器来选取 HTML 元素 $('#id') $('.c...

  • jQuery 大全

    jQuery 元素选择器 jQuery 使用 CSS 选择器来选取 HTML 元素。 $("p") 选取 元素...

  • jquery选择器书目录

    jquery选择器-基本选择器 jquery选择器-层级选择器 jquery选择器-基本过滤选择器 jquery选...

  • 2018-10-11 jquery 第一天思维导图笔记

    jQuery 第一天 jQuery使用,jQuery选择器 jQuery整体框架设计 回顾js课程 jQuery ...

  • JQUERY一

    jQuery 元素选择器 jQuery 属性选择器 jQuery CSS 选择器 jQuery 事件 jQuery...

  • jquery选择器

    jQuery 是一个 JavaScript 函数库。 jQuery 元素选择器 jQuery 使用 CSS ...

  • jQuser有选择器

    jQuery基本选择器 jQuery过滤选择器 jQuery层级选择器 jQuery筛选选择器(方法)

网友评论

      本文标题:jquery选择器的使用

      本文链接:https://www.haomeiwen.com/subject/ltiazftx.html