jQuery选择器

id选择器格式

$("#box")      //获取标签里的id是box的标签

类选择器格式

$(".a")      //获取标签里的类名是a的标签

标签选择器格式

$("div")     //获取标签是div的标签

结构选择器格式

$("li:mth-child(odd)")   //获取标签是li的奇数的li

综合实例

//作用：获取元素

<!doctype html>

<html>

<head>

<meta charset="utf-8">

    <!--导入jQuery-->

<script src="jquery-3.6.0.min.js"></script>

<style>

</style>

</head>

<body>

	<ul>

		<li class="a">12</li>

		<li>34</li>

		<li>4</li>

		<li class="a">5</li>

		<li>55</li>

		<li id="box">999</li>

	</ul>

<script>

     //id选择器

     var li1=$("#box")

	 console.log($("#box"))

     //类选择器

     var li2=$(".a")

	 console.log($(".a"))

     //标签选择器

     var li2=$("li")

	 console.log($("li"))

    //结构选择器

       //获取所有奇数个li

     var li2=$("li:nth-child(odd)")

	 console.log($("li:nth-child(odd)"))

     //获取所有第个偶数li

     var li2=$("li:nth-child(even)")

	 console.log($("li:nth-child(even)"))

</script>

</body>

</html>

JQuery选择器的使用和分类的更多相关文章

  1. JQuery制作网页—— 第六章 jQuery选择器

    1.jQuery选择器:jQuery选择器类似于CSS选择器,用来选取网页中的元素.       Eg:$("h3").css("background",&qu ...

  2. jQuery选择器的分类之过滤选择器

    jQuery选择器的分类之过滤选择器 上一篇文章为大家简单呢的介绍了jQuery选择器中的基本选择器,层级选择器,表单选择器,接下来就带大家了解一下过滤选择器... 过滤选择器都分为哪些??? 1.基 ...

  3. jQuery选择器的分类

    jQuery选择器的分类 jQuery中有很多分类,大类分为四类,四类里面又分为很多小类,下面就为大家一一介绍,这些选择器的使用和好处,Me用的是jQuery1.8.3的版本 选择器都有哪四类?? 1 ...

  4. 二、jquery选择器

    在jquery库中,可以通过选择器实现DOM元素快捷选择这一重要的核心功能. 1.选择器的优势 (1)代码更简单 由于在jquery库中,封装了大量可以通过选择器直接调用的方法或函数,使编写代码更加简 ...

  5. jQuery选择器和DOM操作——《锋利的jQuery》（第2版）读书笔记1

    第1章 认识jQuery jQuery有以下优势: 轻量级: 强大的选择器: 出色的DOM操作的封装: 可靠的事件处理机制: 完善的Ajax: 不污染顶级变量: 出色的浏览器兼容性: 链式操作方式: ...

  6. JQuery选择器使用

    问题描述:         JQuery选择器使用   问题说明:       1.在页面中创建一个导航条,单击标题时,可以伸缩导航条的内容,标题中的提示图片也随之改变       2.单击" ...

  7. 浅谈jquery选择器

    首先来说说jquery选择器的优势: 1.简洁的写法  2.支持css1.0到3.0选择器 3.完善的处理机制. 再来说说分类: jquery选择器分为基本选择器.层次选择器.属性选择器.基本过滤选择 ...

  8. jQuery简介以及jQuery选择器

    一 简介 1 定义:jQuery库是JavaScript的封装库 2 优点: 1) : 代码开源 2) : 选择器强大 3) : 完善的Ajax 4) : 浏览器兼容性高 5) : 文档完善(帮助文档 ...

  9. jQuery选择器的学习

    jQuery的核心在于它的选择器,通过观看视频和阅读,发现jQuery选择器大体上的分类可分为这么几种(不同人方式不同,这里选择一个自认为比较好的): 1.基础选择器(对应api文档中的基本选择器和层 ...

随机推荐

  1. Excel数据导出功能

    HTML代码: <a id="aExportData" hidden><span>Export</span></a> <div ...

  2. SpringCloud Alibaba实战（12：引入Dubbo实现RPC调用）

    源码地址:https://gitee.com/fighter3/eshop-project.git 持续更新中-- 大家好,我是老三,断更了半年,我又滚回来继续写这个系列了,还有人看吗-- 在前面的章 ...

  3. flink使用命令开始、停止任务

    命令操作 进行flink的安装目录 动态上传jar包启动job ./bin/flink run -c com.test.CountMain -P 3 Test-1. 0-SNAPSHOT.jar -- ...

  4. Linux（centos7）设置docker服务开机自启动以及容器自启动

    docker服务开机自启动 systemctl enable docker 设置容器自启动 可以在运行的时候通过设置--restart 参数 docker run --restart always - ...

  5. js判断是电脑(pc)访问还是手机(mobile)访问

    <script> if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iOS|iPad|Backerry|WebOS|Symb ...

  6. tomcat startup.bat 启动中文显示乱码

    打开tomcat文件夹到conf目录下 修改logging.properties 找到 java.util.logging.ConsoleHandler.encoding = utf-8这行 更改为 ...

  7. 聊一聊Yarp结合Nacos完成服务发现

    背景 Yarp 这个反向代理出来后,相信还是有不少人在关注的. 在 Yarp 中,反向代理的配置默认也是基于配置文件的,也有不少大佬已经把这个配置做成了数据库配置+可视化界面. 仔细想了想,做成数据库 ...

  8. 【LeetCode】405. Convert a Number to Hexadecimal 解题报告（Java & Python）

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 Java解法 Python解法 日期 题目地址:ht ...

  9. sql注入 —sqli-labs/Less-5 逻辑注入

    逻辑注入: 1.尝试查询数据库: (1)判断数据长度 -- 构造逻辑判断:and length(database())=8 当长度等于"8 "时回显正常,所以数据库长度为" ...

  10. C++ 虚函数和友元

    虚函数具有动态联编性,在类族中有强大功能:友元函数具有跨类访问的功能,本质却是一种对封装的破坏. 先看这样一个例子: #include<iostream> using namespace ...