jQuery选择器是我们学jQuery的真正的开始也是我们必须做的第一件事情,jQuery选择能让我们取得我们想要的几乎所有的页面DOM对象(如果你不知道什么是DOM元素,google一下“什么是DOM”)。确切的说我们获取的应该是jQuery对象,这在上面的章节中我已经说过两者的区别和转换。
大家知道javascript变成中很大一块是对DOM的操作,当我们获取了DOM元素后,我们就可以对改元素绑定事件,增删属性等操作,通过这些操作可以实现很多绚丽的页面效果和富因特网的应用,但是我们在做这些事情之前首相要通过DOM元素的钩子找到该DOM元素,javascript是非常灵活的语言,查找DOM元素和DOM元素的钩子方法非常多,再者由于各个浏览器对js dom属性解析的少许区别,也给我们带来了不少麻烦。jQuery的选择器就解决了这些问题,而且功能非常强大。
jQuery选择器函数–$()
大家可以去很多jQuery程序,绝大部分的函数都是从$()开始的,$()函数简化了javascript获取DOM元素的复杂性,消除了使用for循环获取一组DOM元素,所以$()函数获取的DOM元素其实是一个DOM元素组成的数组。
简单的$()
这些是最常用的几个例子:
- $(“div”):标签名,取得DOM文档中所有div标签的元素,返回的是一个元素集合;
- $(“#nickName”):ID属性,取得DOM文档中ID为nickName的一个元素(ps:一个文档中ID是唯一的),返回的是一个元素;
- $(“.user”):样式名,取得DOM文档中class为user的所有元素,返回的是一个元素集合;
我们来看一个简单的例子:
[code=”html”]
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
jQuery简单的选择器
- $(“div”):标签名,取得DOM文档中所有div标签的元素,返回的是一个元素集合;
- $(“#nickName”):ID属性,取得DOM文档中ID为nickName的一个元素(ps:一个文档中ID是唯一的),返回的是一个元素;
- $(“.user”):样式名,取得DOM文档中class为user的所有元素,返回的是一个元素集合;
- $(“.user”):样式名,取得DOM文档中class为user的所有元素,返回的是一个元素集合;
[/code]
$(“h1”).addClass(“txt-color1”);表示给标签为h1的加上txt-color1样式,
这里你要注意jQuer库的引用路径。我这里使用的是本地的。
尽情期待下一篇《像写css选择器一样写jQuery选择器》
最新评论
写的挺好的
有没有兴趣翻译 impatient js? https://exploringjs.com/impatient-js/index.html
Flexbox playground is so great!
感谢总结。
awesome!
这个好像很早就看到类似的文章了
比其他的教程好太多了
柯理化讲的好模糊…没懂