上一篇属于对jQuery进行一个简单的概述，这篇我们重点学习一下jQuery选择器最强大的、使用最频繁的两个功能：
10年积累的成都网站建设、成都网站制作经验，可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你，你也不认识我。但先做网站后付款的网站建设流程，更有福海免费网站建设让你可以放心的选择与我们合作。
（1）利用选择器选择DOM元素
（2）创建新的DOM元素
一、选择将被操作的元素
jQuery的元素选择方法是集大成的，包括通过元素ID，CSS类，标签名称以及页面元素的DOM层次结构进行选择。
大家可以根据选择器实验室(Selector Lab)这个页面结合这篇文章来学习，实际操作。
1、利用基本CSS选择器
下面举几个简单的例子给大家热热身
（1）选择器匹配所有链接元素
$("a");（2）选择器匹配id为specialID的元素
$("#specialID");（3）选择器匹配拥有CSS类specialClass的元素
$(".specialClass");（4）选择匹配id为specialID、拥有CSS类specialClass的链接元素
$("a#specialID.specialClass");（5）选择器匹配拥有CSS类specialClass、在
元素内声明的链接元素
$("p a.specialClass");总的来说，jQuery就是支持CSS，包括完全兼容CSS3，反正在学jQuery之前，我对CSS是什么也完全不知道，现在了解的也仅仅是它是一个样式开发的东东。不过我想这也完全不影响我学习jQuery。
2、利用子选择器、容器选择器和特性选择器
下面见识一下稍微高级一点的玩法。这样一段html代码。
jQuery supports
- CSS1
- CSS2
- CSS3
- Basic XPath
jQuery also supports
- Custom selectors
- Form selectors
如果我现在想选择第2行元素，那么选择器要怎么写？也许你会马上想到这样
$("ul.list li a");当然，这么写我们是选择上了第2行的元素，但是我们也同时把4，5，6行的元素也选择上了。这并不是我们想要的，所以子选择器“>”登场。
$("ul.list > li > a");这样就独一无二的选择出了第2行的元素。“>”是选择父节点的直接子节点。
同样，使用特性选择器也能达到我们想要的结果。因为第2行的元素有href特性，并且其值为字符串“http://”使其与众不同，所以利用这一特性便能准确的匹配出我们想要的。
$("a[href^=http://]");“^”表示选择器匹配包含以http://开头的href值的所有链接。如果替换成“$”，则表示选择器匹配包含以http://结尾的所有链接。替换成“*”表示选择器匹配任何部位中包含http://字符串的所有链接。
接着是容器选择器，是指有时我们选择的元素包含在某个其他元素中。举个例子：想要找到所有包含链接的列表元素。可以这样写
$("li:has(a)");这块提一下，这么写绝对与
$("li a");表达的意思不一样，前者表示包含的元素，后者表示在中的元素。指的目标元素不同。
3、通过位置选择
有时候根据元素在页面上的位置或者与其他元素的关系去选择元素，会使问题变得更加简单。
比如：页面上的第一个元素，我们可以写成
$("a:first");列表元素的最后一个子节点
$("li:last-child");
| Language |
Type |
Invented |
| Java |
Static |
1995 |
| Ruby |
Dynamic |
1993 |
| Smalltalk |
Dynamic |
1972 |
| C++ |
Static |
1983 |
有这么一段html代码，生成的格式即为
根据这个表格再介绍几个位置选择的语法。
（1）选择匹配Language这列
$("table td:first-child");或者
$("table td:nth-child(1)");要说明的是:nth-child()里的索引是从1开始记数的。
（2）选择匹配第三行，第三列的元素，“1972”
$("table td:eq(5)");要注意的是这里的:eq()里的索引是从我们熟悉的0开始的。
（3）选择匹配第三行，第三列之前的所有元素
$("table td:lt(5)")
4、利用自定义jQuery选择器
有些时候我们只依赖于CSS规范没法达到我们目的，所以jQuery为我们提供了自定义选择器，这样选择器真的就变的越发的强大了。
具体的自定义jQuery选择器有哪些，大家可以到网上查一下，我只介绍一个， :not筛选器
筛选选择器：通过对元素应用更高的选择标准，缩小正在匹配的元素的集合。比如“input:not(:checkbox)”选择非复选框的元素。筛选选择器一般都是以冒号（:）或者左方括号（[）开头。除筛选选择器外，其他任何选择器都不能在:not()筛选器里使用。
查找选择器：查找与已选择元素具有某种关系的其他元素。比如 “li a ”已选择元素li 包含关系的元素a。另外，后代选择器、子节点选择器、兄弟节点选择器均属于这一范畴。
关于这两个定义我也有点没太理解好，大家可以在使用中多多体会。
二、生成新HTML
本来这篇不想再写这个标题的， 边学边写总觉得有点累，但是当我学习完这部分的内容之后，又有点热血沸腾了，所以想给大家表一下。
上篇我们其实也写了一个演示了一个比较简单的例子，新建一个段落元素
$("Hello World");下面的代码大家注意了，很好玩。
$("I am iron man!
I am Tony Stark")
.filter(".iron").click(function(){
alert("I'm Iron Man!");
}).end().appendTo("#Avengers");
解释一下，开始创建了两个
元素，一个带有类iron，一个没有，.filter选择出带有类iron的
，并给它绑定鼠标点击事件，一点击这个
就会出现对话框“I’m Iron Man!”，再用.end还原到两个
的完整集合，再使用.appendTo把这两个新建的元素追加到id为Avengers的元素之后，从而把它们绑定到DOM树。
哇！大家好好体会一下，在创建的同时，把所有相关的事情都做了，几乎就像是原html代码一样。有没有很爽？
今天就先写到这里，有点累了，不过还没结束，关于创建元素包装集的内容会在 jQuery 学习系列笔记（二）（续） 中表给大家
关于jQuery的学习系列笔记我写的会比较简洁，更注重的是快速上手使用，当然，非常重要的知识点我还是会专门指出的。
PS：欢迎留言交流，24小时内必有回复。
文章题目：jQuery学习系列笔记（二）
分享地址：
http://csdahua.cn/article/pjpsjh.html
扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
