JQuery中的选择器数量和JavaScript中的选择器数量相差无几，JQuery中的选择器类型如下图：

代码实现：

<script src="JS/jquery-3.4.1.js"></script>

    <script>

        // 利用JQuery创建程序入口1

        $(document).ready(function(){

            var $div = $('#div1');

            alert($div);

        });

        // 利用JQuery创建程序入口2

        $(function(){

            var $div = $('#div');

            alert($div);

        });

        // JQuery中的选择器

        // 类选择器

        $(function(){

            var $div = $('.cd1');

            $div.css({'color':'red','background':'blue'});

        });

        // ID选择器

        $(function(){

            var $div = $('#div2');

            $div.css({'color':'black','background':'yellow'});

        });

        // 标签选择器

        $(function(){

            var $div = $('div');

            $div.css({'width':'200px','height':'200px'});

        });

        // 层级选择器

        $(function(){

            var $div = $('#div3 #div4');

            $div.css({

                'color':'yellow',

                'background':'cyan'

            });

        });

        // 组选择器

        $(function(){

            var $div = $('#div3,#div5');

            $div.css({

                'background':'pink',

                'color':'white'

            });

        });

        // 标签选择器

        $(function(){

            var $txt = $('input[name=my_text]') ;

            $txt.val('找到你了');

        });

   </script>

<body>

    <div id="div1" class="cd1">AAA</div>

    <div id="div2" class="cd2">BBB</div>

    <div id="div3" class="cd3">CCC

        <div id="div4" class="cd4">DDD

            <input type="text" name="my_text">

        </div>

    </div>

    <div id="div5">EEE

    </div>

</body>

JQuery之选择器的类型的更多相关文章

  1. jQuery 的选择器常用的元素查找方法

    jQuery 的选择器常用的元素查找方法 基本选择器: $("#myELement")    选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myE ...

  2. HTML 学习笔记 JQuery（选择器）

    学习前端也有一段时间了,今天终于进入到JQuery阶段了,对于新手来讲,JQuery的选择器类型之多 功能之强大实在不是一天两天能够记得完的.现在,就采用边学边记录的方式.以后要是忘了的话,也有一个地 ...

  3. jQuery的选择器中的通配符总结

    1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']&quo ...

  4. jquery 之选择器

    一.基本: HTML代码: <p class="p1">p段落</p> <h class="h1">h标签</h> ...

  5. jQuery过滤选择器

    //基本过滤器$('li:first').css('background','#ccc');//第一个元素$('li:last').css('background','red');//最后一个元素$( ...

  6. jquery相对选择器,又叫context选择器，上下文选择器;find()与children()区别

    jquery相对选择器有两个参数,jQuery函数的第二个参数可以指定DOM元素的搜索范围(即以第二个参数指定的内容为容器查找指定元素). 第二个参数的不同的类型,对应的用法如下表所示. 类型 用法 ...

  7. 关于jquery ID选择器的一点看法

    最近看到一道前端面试题: 请优化selector写法:$(".foo div#bar:eq(0)") 我给出的答案会是: 1. $("#bar") 2.  $( ...

  8. jquery下 选择器整理

    jQuery 的选择器可谓之强大无比,这里简单地总结一下常用的元素查找方法 $("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个 ...

  9. jquery常用选择器（转）

    jQuery 的选择器可谓之强大无比,这里简单地总结一下常用的元素查找方法 $("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个 ...

随机推荐

  1. CHRONY 时间服务器

    时间同步服务chrony ntp network time Protocol之前使用的同步协议 chrony ntp协议的实现,兼容网络中的ntp服务(centos7之后就不再使用ntp,转而使用ch ...

  2. CSP-S 46 题解

    改完题了,就稍写一下题解,顺便反思一下! 其实这次考试挺水的,然而我也挺水的,看了考试结束后的成绩,就吃-*了! T1 set 这个我考试的时候实在是没有想到如何去判断-1,然后我就觉得这神仙题没法解 ...

  3. printf的实现原理

    printf的声明    int _cdecl printf(const char* format, …);    _cdecl是C和C++程序的缺省调用方式 _CDEDL调用约定:    1.参数从 ...

  4. VS安装

    1. 只更改工作负载和单个组件 工作负载:我只勾选3个需要的 单个组件:  勾选  .NET 下Framework   别的不用改 2.点击安装,安装完成重启

  5. nyoj 463-九九乘法表

    463-九九乘法表 内存限制:64MB 时间限制:1000ms 特判: No 通过数:16 提交数:41 难度:1 题目描述: 小时候学过的九九乘法表也许将会扎根于我们一生的记忆,现在让我们重温那些温 ...

  6. 简单说说基于JWT的token认证方式

    一.什么是认证 好多人不知道什么是认证,认证,其实就是服务端确认用户身份.Http协议是无状态的,客户端发送一条请求,服务端返回一条响应,二者就算做成一单买卖,一拍两散.在很久以前,互联网所能提供的服 ...

  7. vim常用插件使用方法整理【持续更】

    nerdtree 和编辑文件一样,通过h j k l移动光标定位切换工作台和目录 ctr+w+h 光标focus左侧树形目录,ctrl+w+l 光标focus右侧文件显示窗口. ctrl+w+w,光标 ...

  8. 五年老Android，我决定转后端开发了！

    今天给大家分享一些移动端(Android)开发学习后端开发(Java Web)的一些事儿,不知道从什么时候开始身边的同事都开始陆陆续续的在朋友圈发一些后端的文章如:Nginx.Docker.k8s类的 ...

  9. Java学习笔记 线程池使用及详解

    有点笨,参考了好几篇大佬们写的文章才整理出来的笔记.... 字面意思上解释,线程池就是装有线程的池,我们可以把要执行的多线程交给线程池来处理,和连接池的概念一样,通过维护一定数量的线程池来达到多个线程 ...

  10. 《HelloGitHub》第 44 期

    兴趣是最好的老师,HelloGitHub 就是帮你找到兴趣! 简介 分享 GitHub 上有趣.入门级的开源项目. 这是一个面向编程新手.热爱编程.对开源社区感兴趣 人群的月刊,月刊的内容包括:各种编 ...