JavaScript（15）jQuery 选择器
jQuery 选择器
选择器同意对元素组或单个元素进行操作。
jQuery 元素选择器和属性选择器同意通过标签名、属性名或内容对 HTML 元素进行选择。
在 HTML DOM 术语中：选择器同意对 DOM 元素组或单个 DOM 节点进行操作。
jQuery 元素选择器
jQuery 使用 CSS 选择器来选取 HTML 元素。
$("p") 选取 <p> 元素。
$("p.intro") 选取全部 class="intro" 的 <p> 元素。
$("p#demo") 选取全部 id="demo" 的 <p> 元素。
jQuery 属性选择器
jQuery 使用 XPath 表达式来选择带有给定属性的元素。
$("[href]") 选取全部带有 href 属性的元素。
$("[href='#']") 选取全部 href 属性的值等于 "#" 的元素。
$("[href!='#']") 选取全部 href 值不等于 "#" 的元素。
$("[href$='.jpg']") 选取全部 href 值以 ".jpg" 结尾的元素。
jQuery CSS 选择器
jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。
以下的样例把全部 p 元素的背景颜色更改为红色：
$("p").css("background-color","red");
上面的看完了我也不知道选择器是什么。。。
来点自己的理解和总结。。。
选择器语法：$("......")
也能够这样分类：
① 选取全部元素：$("*")（注意里面是”星号“）
② 选取class：$(".class名") （注意前面有个”点“）
③ 选取id：$("#id名")
④ 选取元素：$("标签名")
⑤ 选取属性：$("[属性名]")
⑥ 依据特征来选取元素：$(":特征")（注意前面有个”冒号“）
这六种选择器还能够组合一下，产生很多其它的选择器。
比方：④②、④⑥
还能够是：④④⑥、④③②（同类型之间要用“空格”隔开。如：$("ul li:first")、$("div#intro .head")）
选取当前 HTML 元素：$(this)
嵌套选择器
如：选取指定标签中的其他标签中的元素：$(标签名 *)
（注意指定的标签中一定要有其他标签，否则没有效果。
道理就是我为我家狗狗取名叫小狗，但实际是我家根本没有狗狗。
。。
）
假设要进一步选择css属性：$("......").css("......")
$("[属性名='#']") 选取全部属性的值等于 "#" 的元素。
$("[属性名!='#']") 选取全部属性的值不等于 "#" 的元素。
$("[属性名$='.jpg']") 选取全部属性的值以 ".jpg" 结尾的元素。
提示：
依据实践，某些浏览器使用 * 的处理速度缓慢。
不要使用数字开头的 ID 名称！
在某些浏览器中可能出问题。
不要使用数字开头的类名！在某些浏览器中可能出问题。
详细使用时，能够參考“jQuery 选择器參考手冊”。看看有哪些选择器。
这篇写得比較短，但事实上花费的时间比較多。看了非常多样例。
认为如今还是不要每一个都看一遍。以后用到的话边用边学，然后能够在这里补充。
最后还是贴段代码吧。好像代码生动形象直观了当。。
。
（太懒了，我仅仅想贴一份大杂烩代码（涉及到覆盖）。。
。）
<html> <head>
<script type="text/javascript" src="jquery-1.11.1.js"></script>
<script type="text/javascript"> $(document).ready(function(){
$(":header").css("background-color","grey"); $("div *").css("background-color","blue");
$("p *").css("background-color","purple"); $("p").css("background-color","yellow"); $("ul li:first").css("background-color","pink");
$("div#choose .introtoo").css("background-color","green");
}); </script>
</head> <body> <html>
<body> <h1>Welcome to My Homepage</h1> <p class="intro">My name is Donald</p>
<p>I live in Duckburg</p>
<p>My best friend is Mickey</p> <div id="choose">
<p class="introtoo">My name is Donald, too</p>
Who is your favourite:
<ul>
<li>Goofy</li>
<li>Mickey</li>
<li>Pluto</li>
</ul>
</div> </body>
</html> </body> </html>
结果：
Welcome to My Homepage
My name is Donald
I live in Duckburg
My best friend is Mickey
My name is Donald, too
Who is your favourite:
- Goofy
- Mickey
- Pluto
JavaScript（15）jQuery 选择器的更多相关文章
- jQuery 选择器和JavaScript 选择器的技巧与异常原因
jquery的选择器借鉴了css选择器,核心依然依靠JavaScript的getElementById()和getElementsByTagName()方法,但是他封装了2个方法,让jquery选择器 ...
- Java程序猿的JavaScript学习笔记（8——jQuery选择器）
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- jQuery选择器实现隔行变色和使用javaScript实现隔行变色
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <!--什么是选择器? jQuery选择器继承了 ...
- 在.NET中使用JQuery 选择器精确提取网页内容
1. 前言 相信很多人做开发时都有过这样的需求:从网页中准确提取所需的内容.思前想后,方法无非是以下几种:(本人经验尚浅,有更好的方法还请大家指点) 1. 使用正则表达式匹配所需元素.(缺点:同类型的 ...
- JavaScript、Jquery选择题
尚学堂Java EE软件工程师认证考试 试题库-选择题 一. 选择题(包括单选和双选) 1.B 在JavaScript中,以下变量命名非法的是( )(选择一项) A. numb_1 ...
- JavaScript、jQuery、HTML5、Node.js实例大全-读书笔记2
技术很多,例子很多,只好慢慢学,慢慢实践!!现在学的这本书是[JavaScript实战----JavaScript.jQuery.HTML5.Node.js实例大全] JavaScript.jQuer ...
- jquery选择器从认识到使用初级篇
1. .class 选择器 ---一种通过元素类别属性查找元素 调用格式: $(".class") ----其中参数表示元素的css类别名称(类选择器)<input cl ...
- Jquery 选择器 详解 js 判断字符串是否包含另外一个字符串
Jquery 选择器 详解 在线文档地址:http://tool.oschina.net/apidocs/apidoc?api=jquery 各种在线工具地址:http://www.ostools ...
- JQuery选择器大全 前端面试送命题：面试题篇 对IOC和DI的通俗理解 c#中关于协变性和逆变性（又叫抗变）帮助理解
JQuery选择器大全 jQuery 的选择器可谓之强大无比,这里简单地总结一下常用的元素查找方法 $("#myELement") 选择id值等于myElement的元素 ...
随机推荐
- 关于 调用 JNI JAR 的说明和注意事项，调用第三方 JAR SDK 和 翻译 安卓 JAVA 代码 的说明 V2015.6.10
关于 调用 JNI JAR 的说明和注意事项,调用第三方 JAR SDK 和 翻译 安卓 JAVA 代码 的说明 V2015.6.10 转载请标明出处,否则死全家.选择[复制链接]即可得到出处. (* ...
- C#.Net操作XML方法二
上面那篇博客,在上面那面博客中是通过System.Xml命名空间中的类来实现对XML文件的创建.删除和改动等操作.接下来再介绍一种方法,在整个的操作过程中,仅仅只是换了个类而已,没什么大惊小怪的. D ...
- 网页WEB打印控件
网页WEB打印控件制作 在WEB系统中,打印的确是比较烦人的问题,如果我们能制作一个属于自己的自定义的打印插件,那么我们在后续自定义打印的时候能随心所欲的控制打印,这样的效果对于程序员来说是非常开心的 ...
- 基于visual Studio2013解决面试题之0604O(1)时间复杂度删除链表节点
题目
- OpenCV中遇到Microsoft C++ 异常 cv::Exception
我在实现<OpenCV2计算机视觉编程手册>第2章 2.2 节 存取像素值 中的椒盐噪声例子中遇到的程序错误. 原始输入程序: #include <opencv2/core/core ...
- hdu1087Super Jumping! Jumping! Jumping!(最大递增序列和)
题意:棋牌游戏如今,一种被称为“超级跳!跳!跳!“HDU是非常流行的.也许你是个好孩子,这个游戏知之甚少,所以我介绍给你吧. 可以玩游戏由两个或两个以上的球员 .它由一个棋盘(棋盘)和一些棋子(棋子) ...
- 杭电 1711 Number Sequence
Number Sequence Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) ...
- 关于Hibernate数据库连接进程释放
最近手里头又一桩事情蛮好玩的,就是用Hibernate进行批处理的时候,发现连接数暴增,oracle连接进程数吓死人.解决方案:不是把连接池设置成最大,那样服务器承载不了.及时清除缓存.另外在hibe ...
- winform基础——数据访问及几个案例
数据访问分为三个部分:(1)创建链接(2)创建与执行命令(3)读取或准备相关数据 一,需要引用的命名空间 using data: using data.SqlClient; 二,创建与数据库的链接—— ...
- poj 3082多边形相交 'Roid Rage
题意是判断多边形是否相交 主要的思路就是判断每一个点是否在另外的多变形内 判断一个点是否在另一个多边形内主要思路是: 判断的那个点向左边做射线,如果射线与多边形的交点为奇数个则在多边形内,偶数个则不在 ...