JQuery选择器的使用和分类
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选择器的使用和分类的更多相关文章
- JQuery制作网页—— 第六章 jQuery选择器
1.jQuery选择器:jQuery选择器类似于CSS选择器,用来选取网页中的元素. Eg:$("h3").css("background",&qu ...
- jQuery选择器的分类之过滤选择器
jQuery选择器的分类之过滤选择器 上一篇文章为大家简单呢的介绍了jQuery选择器中的基本选择器,层级选择器,表单选择器,接下来就带大家了解一下过滤选择器... 过滤选择器都分为哪些??? 1.基 ...
- jQuery选择器的分类
jQuery选择器的分类 jQuery中有很多分类,大类分为四类,四类里面又分为很多小类,下面就为大家一一介绍,这些选择器的使用和好处,Me用的是jQuery1.8.3的版本 选择器都有哪四类?? 1 ...
- 二、jquery选择器
在jquery库中,可以通过选择器实现DOM元素快捷选择这一重要的核心功能. 1.选择器的优势 (1)代码更简单 由于在jquery库中,封装了大量可以通过选择器直接调用的方法或函数,使编写代码更加简 ...
- jQuery选择器和DOM操作——《锋利的jQuery》(第2版)读书笔记1
第1章 认识jQuery jQuery有以下优势: 轻量级: 强大的选择器: 出色的DOM操作的封装: 可靠的事件处理机制: 完善的Ajax: 不污染顶级变量: 出色的浏览器兼容性: 链式操作方式: ...
- JQuery选择器使用
问题描述: JQuery选择器使用 问题说明: 1.在页面中创建一个导航条,单击标题时,可以伸缩导航条的内容,标题中的提示图片也随之改变 2.单击" ...
- 浅谈jquery选择器
首先来说说jquery选择器的优势: 1.简洁的写法 2.支持css1.0到3.0选择器 3.完善的处理机制. 再来说说分类: jquery选择器分为基本选择器.层次选择器.属性选择器.基本过滤选择 ...
- jQuery简介以及jQuery选择器
一 简介 1 定义:jQuery库是JavaScript的封装库 2 优点: 1) : 代码开源 2) : 选择器强大 3) : 完善的Ajax 4) : 浏览器兼容性高 5) : 文档完善(帮助文档 ...
- jQuery选择器的学习
jQuery的核心在于它的选择器,通过观看视频和阅读,发现jQuery选择器大体上的分类可分为这么几种(不同人方式不同,这里选择一个自认为比较好的): 1.基础选择器(对应api文档中的基本选择器和层 ...
随机推荐
- Django-利用LogEntry生成操作历史
在开发测试平台的时候,虽然对某些关键功能做了权限设置,但毕竟是公司多人使用,有些数据的配置可能不小心被他人修改但未告知其他使用者,造成了诸多不便.所以决定开发一个操作历史表,可以方便查看数据地改动. ...
- Django把现在时间写入数据库,模板渲染在页面中
1. 导入time模块 import time 2. 获取现在时间,使用"年-月-日 时:分:秒"这样的模板,赋值给变量 在views.py中: pt = time.strftim ...
- java 8 启动脚本优化
1 #!/bin/bash 2 3 JAVA_HOME=/usr/java/default 4 5 #java虚拟机启动参数 6 JAVA_OPTS="-server -Xms1366m - ...
- powerdesigner 连接数据库
powerdesigner 连接数据库如图:
- Sentry 开发者贡献指南 - SDK 开发(性能监控)
内容整理于官方开发文档 系列 Docker Compose 部署与故障排除详解 K8S + Helm 一键微服务部署 Sentry 开发者贡献指南 - 前端(ReactJS生态) Sentry 开发者 ...
- 谷歌protobuf(protocol-buffers)各种开发语言数据类型转换说明
官方文档:https://developers.google.cn/protocol-buffers/docs/proto proto2 proto3
- cmake之譬判断cmake的版本
note 有时候,可能使用的cmake语法 与cmake的版本有关系, 比如modern cmake. 这时候我们可以在 CMAKELISTS.TXT中 判断 cmakeLists.txt 代码 if ...
- ubuntu下AF_INET和AF_INET6的值
关于 演示环境 $ uname -a Linux xxxxxxx 5.4.0-47-generic #51-Ubuntu SMP Fri Sep 4 19:50:52 UTC 2020 x86_64 ...
- 【LeetCode】1414. 和为 K 的最少斐波那契数字数目 Find the Minimum Number of Fibonacci Numbers Whose Sum Is K
作者: 负雪明烛 id: fuxuemingzhu 个人博客:http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 贪心 日期 题目地址:https://leetcode ...
- 【LeetCode】344. Reverse String 解题报告(Java & Python)
作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 新构建字符串 原地翻转 日期 题目地址:https://lee ...