jQuery开发之jQuery选择器一
来源:互联网 发布:vb picturebox 绘图 编辑:程序博客网 时间:2024/06/05 10:23
1,CSS选择器
常用的css选择器如下表:
2,jQuery选择器
CSS 获取到元素的代码如下:
<code class="hljs r has-numbering">.demo{ //给class为demo的元素添加样式<span class="hljs-keyword">...</span>}</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li></ul>
jQuery获取元素的代码如下:
<code class="hljs r has-numbering">$(<span class="hljs-string">".demo"</span>).click(<span class="hljs-keyword">function</span>(){ //给class为demo的元素添加行为<span class="hljs-keyword">...</span>});</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li></ul>
jQuery选择器和CSS选择器的写法十分相似,只不过两者的作用效果不同,CSS选择器是找到元素后添加样式,而jQuery选择器是找到元素后添加行为。
jQuery选择器的优势
(1)简洁的写法
$()
函数在很多的javaScript类库中都被当作一个选择器函数来使用,在jQuery中也不例外。其中$("#ID")
用来代替document.getElementById()函数,即通过ID取元素。$("tagName")
用来代替document.getElementByTagName()函数,即通过标签名获取HTML元素。
(2)支持CSS1 到CSS3选择器
(3) 完善的处理机制
需要注意的是, $("#tt")
获取的永远都是对象,即使网页上没有此元素。因此当要用jQuery检查某个元素是否 存在时,不能使用一下代码:
<code class="hljs ruby has-numbering"><span class="hljs-keyword">if</span>(<span class="hljs-variable">$(</span><span class="hljs-string">"#tt"</span>)){<span class="hljs-regexp">//do</span> something }</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li></ul>
而应该根据获取元素的长度来判断,代码如下:
<code class="hljs ruby has-numbering"><span class="hljs-keyword">if</span>(<span class="hljs-variable">$(</span><span class="hljs-string">"#tt"</span>).length><span class="hljs-number">0</span>){<span class="hljs-regexp">//do</span> something }</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li></ul>
或者转换为DOM对象来判断,代码如下:
<code class="hljs ruby has-numbering"><span class="hljs-keyword">if</span>(<span class="hljs-variable">$(</span><span class="hljs-string">"#tt"</span>)[<span class="hljs-number">0</span>]){<span class="hljs-regexp">//</span> <span class="hljs-keyword">do</span> something }</code>
0 0
- jQuery开发之jQuery选择器一
- jQuery开发之jQuery选择器一
- jQuery开发之选择器二
- jQuery学习之旅 Item1 选择器【一】
- jQuery学习之旅 1 选择器【一】
- jQuery 之 (一)选择器、快捷操作
- JQuery选择器(一) 基本选择器
- jQuery选择器(精华一)
- 一. JQuery选择器
- jQuery选择器(一)
- jQuery选择器(一)
- jquery选择器操作一
- jQuery(一) 选择器
- jQuery选择器总结(一)
- jQuery选择器(一)
- jQuery选择器(一)
- jQuery 学习一:选择器
- jquery选择器(一)
- 5大常用网站推广方法 吸引大流量
- 目标检测的图像特征提取之(一)HOG特征
- 目标检测的图像特征提取之(二)LBP特征
- Android 4.4 中 WebView 使用注意事项
- java基本数据类型
- jQuery开发之jQuery选择器一
- jquery开发之jQuery对象和DOM对象的相互转换
- [bzoj 2653] middle
- lua--函数深入:闭合函数,局部函数,尾调用
- Chrome调试Android应用(Debug)
- php中静态全局变量和全局变量的简单理解
- jquery调用ashx文件和WebMethod方法总结
- 黑马程序员——java基础——集合框架(二: 双列集合 (Map体系))
- 人穷久了或者累久了会sb