jQuery学习2 选择器的使用说明

2016-02-19 14:12 1 1 收藏

下面是个jQuery学习2 选择器的使用说明教程,撑握了其技术要点,学起来就简单多了。赶紧跟着图老师小编一起来看看吧!

【 tulaoshi.com - Web开发 】

1.利用CSS的基本选择器:
a:匹配所有链接a元素。
#*:匹配id为*的元素
.*:匹配CSS类为*的元素
a#*id.*class:匹配id为*id,并拥有CSS类为*class的链接元素。
以上是CSS中的写法,在jQuery中用$("")包起来,如:jQuery("p a.Class")

利用子选择器、容器选择器和特性选择器,以下面的为例:
代码如下:
ul class="myList"
lia href=http://jquery.comjQuery supports/a
ul
  lia href="css1"CSS1/a/li
  lia href="css2"CSS2/a/li
  lia href="css3"CSS3/a/li
  liBasic XPath/li
/ul
/li
li
ul
liCustom selectors/li
liForm selectors/li
/ul
/li
/ul

如果要选择第一个列表li中的所有链接做操作就应利用子选择器:ul.myList li a 而不能像这样ul.myList li a 因为所有这些链接a都是列表li元素的后代节点.
子选择器:父节点与直接子节点以右尖括号()隔开。
特性选择器:将符合特定内容的元素包起来。比如选择包含以http://开头的href值的链接:a[href^=http://]
input[type=text]:匹配type特性为text的所有input元素
div[title=^my]:匹配title特性值以my开头的所有div元素。
通过位置选择
a:first:选择器匹配页面上的第一个a元素
p:odd,p:even 分别匹配奇数和偶数元素
其他就不一一举例了,如有需要可到相关网站查找。

来源:https://www.tulaoshi.com/n/20160219/1606410.html

延伸阅读
标签: Web开发
这个是网页版,直接用ctrl+F搜索,如果大家不是经常上网,可以用chm版的更方便些。 jQuery 1.3 API 参考手册 CHM 锋利的jquery 电子书 近期将会将一些jquery学习教程逐步发一些。参考了锋利的jquery一书。 $的选择器部分: 凡是运用$,其返回值是一个object $选择器主要用于选择标签.基本用法是同css的选择器.但是,很让人兴奋的是,他支持常...
标签: Web开发
但由于工作的原因,很久不曾做过网站项目了,也没有时间去好好研究Jquery的源码,这个疑问也一直没有得到解决了, 今天,空闲之余,打开Jquery的源码看看,才明天它实现的原理,原来在加入jquery的js这个文件时,实际上是执行了一个函数,在这个函数里己经初始化了$和JQuery变量, 实现这个功能源码如下(代码已删减和更改,并不影响说明实现原理)...
标签: Web开发
去年我学jQuery的时候,曾经做过一点选择器(selector)的笔记。 这几天拿出来看了一下,发现很多都忘记了。所以,我决定把它们贴在这里,方便以后查看。这对其他朋友应该也是有用的,毕竟选择器是制作网页效果的第一步。 笔记分为两个部分,今天是CSS的选择器,以后还有一部分xPath的选择器。今天的笔记中包括44个选择器,基本涵盖了CSS 2...
标签: Web开发
//jQuery 选择器 $ //$(expression,[context]) return jQuery //Unit One //expression 之 CSS 定义符 就是以CSS语法表示所要选择的元素 // $("*"); // 表示页面所有元素标签 // $("th, td") // 表示所有thtd元素标签 // $("a") // 表示所有a元素标签 // $("div#onlydiv"); // 表示CSS选择中id=onlyidv的元素 $("#ID")为全文档匹配 // ...
标签: Web开发
基本的CSS选择器 熟悉web开发的人员一定对css的选择功能相当的了解,通过css选择功能,我们可以在css样式文件里轻松的将样式应用到选择的页面元素上。jQuery也正是采用了这样的机制,使jQuery的元素选择能力易常强大。 a——选择所有a元素 #specialID——选择匹配id为specialID的元素 .specialClass——选择匹配拥有css类sepcialClass的元素 a...

经验教程

545

收藏

24
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部