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. Tornadofx学习笔记(4)——IconTextFx开源库,整合5000+个字体图标

    JavaFx中其实也可以直接使用字体图标iconfont的,只需要加载ttf字体文件,之后设置unicode即可,具体可以看我给出的代码 既然JavaFx可以,那么以JavaFx为基础的Tornado ...

  2. C#汉字转汉语拼音

    一.使用PinYinConverterCore获取汉语拼音 最新在做一个搜索组件,需要使用汉语拼音的首字母查询出符合条件的物品名称,由于汉字存在多音字,所以自己写查询组件不太现实,因此,我们使用微软提 ...

  3. CF616B Dinner with Emma 题解

    Content 翻译很明白,或者你也可以看我的简化版题意: 求一个 \(n\times m\) 的矩阵中每行的最小值的最大值. 数据范围:\(1\leqslant n,m\leqslant 100\) ...

  4. LuoguB2105 矩阵乘法 题解

    Content 给定一个 \(n\times m\) 的矩阵 \(A\) 和一个 \(m\times k\) 的矩阵 \(B\),求两个矩阵相乘得到的矩阵. \(n\times m\) 的矩阵 \(A ...

  5. apscheduler 设置python脚本定时任务

    理论概念:https://zhuanlan.zhihu.com/p/95563033 BlockingScheduler与BackgroundScheduler区别 :https://www.jian ...

  6. npm ERR! Error: EPERM: operation not permitted

    转载于:https://blog.csdn.net/qq_36772866/article/details/86934950 win10 在npm install时报错 解决方案 删除node-mou ...

  7. SpringBoot使用 MyBatis Plus 实现物理分页查询

    一.分页配置在MyBatis Plus 可以直接使用selectPage这样的分页,但返回的数据确实是分页后的数据,但在控制台打印的SQL语句其实并没有真正的物理分页,而是通过缓存来获得全部数据中再进 ...

  8. cmake之引入外部项目(引用其他项目)、FetchContent管理子模块(fetchcontent用法)

    本文CMAKE版本为3.18 演示环境: Windows+CMake+VS2017 源码下载说明 演示代码是后来传上去的,而且做了些修改,将spdlog_demo由exe改为了lib,但是,spdlo ...

  9. 【LeetCode】544. Output Contest Matches 解题报告 (C++)

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

  10. 【LeetCode】449. Serialize and Deserialize BST 解题报告(Python)

    [LeetCode]449. Serialize and Deserialize BST 解题报告(Python) 标签: LeetCode 题目地址:https://leetcode.com/pro ...