精华内容
下载资源
问答
  • 选择器并没有一个固定的定义,在某种程度...现在我们正式进入jQuery选择器的学习。根据选择器的功能习惯将选择器进行分类,下面将不同类型的分类器进行分类,并且分别进行解释说明,使读者达到掌握程度。一、基本选择器
  • jquery选择器简述

    2020-11-24 01:11:11
    jQuery选择器使得获得页面元素变得更加容易、更加灵活,从而大大减轻了开发人员的压力。如同盖楼一样,没有砖瓦,就盖不起楼房,得不到元素谈何其他各种操作呢?可见,jQuery选择器的重要性。 jquery选择器大方向可以...
  • jQuery选择器中的大于号>作用是什么: jQuery灵活多样的选择器是jQuery的优点之一。 下面就介绍一下其中的一个选择器,用大于号表示。 代码示例如下: 代码如下: <!DOCTYPE html> <html> <head> <...
  • 下面小编就为大家带来一篇老生常谈jquery id选择器和class选择器的区别。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
  • jquery的多个选择器,就是可以同时选择多个元素进行操作,下面有个不错的示例,感兴趣的朋友可以参考下
  • jQuery 选择器按照功能主要分为"选择"和"过滤. 并且是配合使用的. 可以同时使用组合 成一个选择器字符串. 主要的区别是"过滤"作用的选择器是指定条件从前面匹配的内容中 筛选, "过滤"选择器也可以单独使用, 表示从...
  • 个是select版的,若想美化某些样式是不支持得,大家可以使用div模拟版,下面小编给大家介绍下jQuery双向列表选择器select版,感兴趣的朋友一起看看吧
  • JQ 选择器大全包含:基本选择器,层级选择器,层级函数,过滤选择器,内容选择器,可见选择器,jq中显示相关的函数,属性选择器,子元素选择器,表单选择器。里面的练习题可以拿来练手
  • 本文实例讲述了jQuery选择器之基本选择器用法。分享给大家供大家参考,具体如下: 初学jQuery,为了能系统地学习好jQuery,今天特意把自己的学习心得归纳一下,贴上来与初学者共享,今天我主要总结的是jquery的基本...
  • 下面小编就为大家带来一篇jquery层级选择器的实现(匹配后代元素div)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
  • 下面的方法是选择name是redthree的 并且选中了的input 里面的 title属性的内容 <input name=”redTrdd” title=’xiaoming’> 代码如下: xtest = $(“:input[name=’radThree’][checked]”).attr(“title”);
  • 做前端,需要选择元素,虽说有jquery和各大js库已经帮我造好了轮子,但我想试试自己实现一个,正好项目也不忙,正好加入自己的js文件中,下面是实现代码。用$g(“#content .op”)这种格式就可以调用,和jquery $()的...
  • HTML5向Web API新引入了document.querySelector以及document.querySelectorAll两个方法用来更方便地从DOM选取元素,功能类似于jQuery选择器。这使得在编写原生JavaScript代码时方便了许多。 用法 两个方法使用...
  • 近期看了一些网上关于Sizzle的分析文章,就匹配次序往往就说使用了从右到左的逆向匹配法,...在此先申明一点,下面所说的关系选择器是指W3C中的Combinator选择器,因本人觉得用关系选择器这个名字要比其它更加贴近实际
  • 下面小编就为大家带来一篇浅析jQuery事件之on()方法绑定多个选择器,多个事件。小编觉得挺不错的,现在分享给大家。也给大家做个参考
  • 常用jQuery选择器汇总

    2020-12-08 20:23:23
    学习【js DOM 编程艺术】,最后面有许多jQuery选择器,每个都动手敲了一遍。 jQuery 提供了高级选择器的方法。 j s获取元素的三个基本方法分别是通过标签名,类名和id,即(getElementsByTagName, ...
  • 本文实例讲述了jQuery中:focus选择器用法。分享给大家供大家参考。具体分析如下: 此选择器能够匹配当前获取焦点的元素。 语法结构: 代码如下:$(“:focus”) :focus选择器一般需要和其他选择器配合使用,例如和类...
  • 详解jQuery选择器

    2020-10-20 19:50:53
    本文主要对jQuery选择器进行一一举例介绍,有助于学习、理解和记忆。具有很好的参考价值,下面就跟着小编一起来看下吧
  • jQuery 中$(“”),这个语法等同于$(document.createElement(“span”)) ,这是一用法,在选择元素的时候还会这样子的用:[attribute$=value],匹配给定的属性是以某些值结尾的元素。下面举个例子来说明一下: ...
  • 今天在写一个js延时事件的时候发现在setTimeout这个方法里面使用jquery的$(this)竟然不起作用,各种测试,最后得出结论是setTimeout内不支持jquery选择器。于是请教了一下QQ上做jquery开发的高手,马上就把这问题...
  • JQuery选择器 1.基本选择器 基本选择器是JQuery中最常用的选择器,也是最简单的选择器,它通过元素id、class 和标签名来查找DOM元素。这个非常重要,下面的内容都是以此为基础,逐级提高的。 1).“$(“#id”)”,...
  • jQuery 选择器

    万次阅读 多人点赞 2019-02-22 21:58:10
    一、什么是jQuery选择器 jQuery选择器继承了CSS与Path语言的部分语法,允许通过标签名、属性名或内容对DOM元素进行快速、准确的选择,而不必担心浏览器的兼容性,通过jQuery选择器对页面元素的精准定位,才能完成...

    一、什么是jQuery选择器
    jQuery选择器继承了CSS与Path语言的部分语法,允许通过标签名、属性名或内容对DOM元素进行快速、准确的选择,而不必担心浏览器的兼容性,通过jQuery选择器对页面元素的精准定位,才能完成元素属性和行为的处理。
    二、jQuery选择器的优势

    • 代码更简单;
    • 支持CSS1到CSS3选择器;
    • 完善的机制处理
      三、jQuery选择器
      jQuery选择器分类示意图:
      jQuery选择器分类示意图
      1.基本选择器
      jQuery选择器中使用最多的选择器,它由元素id、class、元素名、多个元素符组成。
      功能表如下:
      基本选择器
      例1:CSS样式:<button id="btn" class="btn1">按钮</button>
      使用如下:
    console.log($("#btn"));
    console.log($(".btn1"));
    console.log($("*"));
    console.log($("button"));
    console.log($("#btn,.btn1,button"));
    

    2.层次选择器
    通过DOM元素间的层次关系来获取元素,主要层次关系包括父子、后代、相邻、兄弟关系。
    功能表如下:
    层次选择器

    说明
    例2:CSS样式如下:

    <ul>
        <li>1</li>
        <li>2
            <ol>
                <li>11</li>
                <li>22</li>
                <li>33</li>
            </ol>
        </li>
        <li class="li3">3</li>
        <p>0000</p>
        <li>4</li>
    </ul>
    

    使用如下:

    console.log($("ul li"));
    console.log($("ul>li"));
    console.log($(".li3+"));
    console.log($(".li3~li"));
    

    3.过滤选择器
    (1)简单过滤选择器
    过滤选择器是根据某类过滤规则进行元素的匹配,书写时都以(:)开头;简单过滤是使用最广泛的一种。
    功能表如下:
    简单过滤选择器
    例3:CSS样式如下:

    <ul>
        <li>1</li>
        <li>2
            <ol>
                <li>11</li>
                <li>22</li>
                <li>33</li>
            </ol>
        </li>
        <li class="li3">3</li>
        <p>0000</p>
        <li>4</li>
    </ul>
    

    使用如下:

    console.log($("ul>li:first"));
    console.log($("ul>li:last"));
    console.log($("ul>li:even"));
    console.log($("ul>li:odd"));
    console.log($("ul>li:gt(1)"));
    console.log($("ul>li:lt(1)"));
    console.log($("ul>li:eq(1)"));
    console.log($("ul>li:not(.li3)"));
    

    (2)内容过滤选择器
    根据元素中的文字内容或所包含的子元素特征获取元素,其文字内容可以模糊或绝对匹配进行元素定位。
    功能表如下:
    内容过滤选择器
    例4:CSS样式如下:

    <ul>
        <li>1</li>
        <li>2
            <ol>
                <li>11</li>
                <li>22</li>
                <li>33</li>
            </ol>
        </li>
        <li class="li3">3</li>
        <p>0000</p>
        <li>4</li>
    </ul>
    <div><span>40</span></div>
    <span></span>
    

    使用如下:

    console.log($("li:contains(2)"));
    console.log($("span:empty"));
    console.log($("span:parent"));
    console.log($("div:has(span)"));
    

    (3)可见性过滤选择器
    根据元素是否可见的特征来获取元素
    功能表如下:
    在这里插入图片描述
    例5:CSS样式如下:

    <input type="button" class="btninput" value="按钮1" >
    <input type="button" class="btninput" value="按钮2" >
    

    使用如下:

    console.log($(".btninput:hidden"));
    console.log($(".btninput:visible"));
    

    (4)属性过滤选择器
    属性过滤选择器根据元素的某个属性获取元素,如ID号或匹配属性值的内容,并以"[“号开始,以”]"号结束。
    功能表如下:
    在这里插入图片描述
    例6:CSS样式:<button id="btn" class="btn1">按钮</button>
    使用如下:

    console.log($("button[id][class]"));
    console.log($("button[id='btn'][class='btn1']"));
    

    (5)子元素过滤选择器
    获取所有父元素中指定的某个元素
    功能表如下:
    在这里插入图片描述
    例7:CSS样式如下:

    <ul>
        <li>1</li>
        <li>2
            <ol>
                <li>11</li>
                <li>22</li>
                <li>33</li>
            </ol>
        </li>
        <li class="li3">3</li>
        <p>0000</p>
        <li>4</li>
    </ul>
    <div><span>40</span></div>
    

    使用如下:

    console.log($("ul>li:nth-child(2)"));
    console.log($("ul>li:first-child"));
    console.log($("ul>li:last-child"));
    console.log($("div>span:only-child"));
    

    (6)表单对象属性过滤选择器
    所选择的表单元素进行过滤,例如选择被选中的下拉框,多选框等元素
    功能表如下:
    在这里插入图片描述
    例7:CSS样式如下:

    <input type="checkbox" checked>
    <input type="checkbox">
    <input type="radio">男
    <input type="radio">女
    <input type="text">
    <select id="sel">
        <option>宝鸡</option>
        <option selected>西安</option>
    </select>
    

    使用如下:

    console.log($("input[type='checkbox']:checked"));
    console.log($("input[type='radio']"));
    console.log($("input[type='text']"));
    console.log($("input:text"));
    console.log($(":input"));
    console.log($(":button"));
    $("#sel").change(function(){
        console.log($("#sel>option:selected"));
    });
    
    展开全文
  • 下面小编就为大家带来一篇jQuery选择器之属性筛选选择器用法详解。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
  • 下面小编就为大家带来一篇JQuery 选择器、DOM节点操作练习实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
  • jquery选择器.pdf

    2020-08-19 00:13:08
    jquery选择器.pdf
  • 下面小编就为大家带来一篇jquery层级选择器(匹配父元素下的子元素实现代码)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
  • 最近在工作中需要用到地址选择器,像下面这样的,本想在网上找一个,可是没找到,于是自己写了个jquery插件。 直接上代码吧: var provinces = { "A": { "安徽":["合肥市","芜湖市","蚌埠市","淮南市","马鞍山...
  • 知识点:了解jQuery选择器的基本概念及优势、能够使用不同的jQuery选择器选取元素,比如基本选择器、层次选择器、属性选择器、基本过滤选择器、可见性过滤选择器的使用,了解使用jQuery选择器的注意事项。...

    知识点:了解jQuery选择器的基本概念及优势、能够使用不同的jQuery选择器选取元素,比如基本选择器、层次选择器、属性选择器、基本过滤选择器、可见性过滤选择器的使用,了解使用jQuery选择器的注意事项。

     

           页面的任何操作都需要节点的支撑,开发者如何快速高效的找到指定的节点也是前端开发中的一个重点。jQuery提供了一系列的选择器帮助开发者达到这一目的,让开发者可以更少的处理复杂选择过程与性能优化,更多专注业务逻辑的编写。

    1、  jQuery选择器简介

            jQuery 选择器允许您对 HTML 元素组 或 单个元素 进行操作。选择器是 jQuery 的根基,在 jQuery 中,对事件处理、遍历 DOM 和 Ajax 操作都依赖于选择器。熟练地使用选择器,不但能简化代码,而且能够事半功倍。jQuery 选择器可通过CSS 选择器、条件过滤两种方式获取元素。可以通过 CSS 选择器语法规则获取元素的 jQuery 选择器包括基本选择器、层次选择器和属性选择器;可以通过条件过滤选取元素的 jQuery选择器包括基本过滤选择器和可见性过滤选择器。

    展开全文
  • 下面小编就为大家带来一篇jQuery选择器之表单对象属性筛选选择器实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
  • 比如下面html代码 代码如下: <ul> ”aaaa” title=”ttt”>li-1</li> ”bbbb”>li-2</li> ”fffff”>li-2</li> </ul> ”aaaa” title=”ttt”>li-1</div> ”bbbb”>li-2</div> ”fffff”>li-2</div> 第一根据属性...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 62,839
精华内容 25,135
关键字:

下面哪种不是jquery的选择器