jQuery基础之（二）jQuery中的$

在jQuery中，最常用的莫过于使用美元符号$，它提供了各种各样的丰富功能。包括选择页面中一个或者一类元素、作为功能函数的前缀、windows.onload的完善，创建DOM节点等。本文介绍jQuery的用法。作为基础

1.选择器

在css中，选择器的作用是选择页面的某一类（类别选择器）元素或者某个（id选择器）。而jQuery中的“$”作为选择器，同样是选择某类或者某个元素，只不过jQuery提供了更全面的选择方式。而且为用户处理了浏览器兼容问题。

例如在在css<h2>下的<a>元素，css：

h2 a{
/* 添加css属性 */}

在jQuery中，通过以下代码选择h2下的a元素，作为一个对象数组，供javascript使用。

$("H2 a")

例子：

<body>    <script type="text/javascript">window.onload = function() {var oElements = $("h2 a"); //选择匹配元素for (var i = 0; i < oElements.length; i++)oElements[i].innerHTML = i.toString();}</script><h2><a href="#">正文</a>内容</h2><h2>正文<a href="#">内容</a></h2><h2>正文<a href="#">内容</a></h2><h2>正文<a href="#">内容</a></h2><h2>正文<a href="#">内容</a></h2></body>

如上，文档中有5个<H2>标记，分别包含了<a>元素，使用$选择器，如下，可以看到jQuery轻松的实现了元素的选择，如果使用DOM,类似这样的节点将要使用大量的javascript代码。

jQuery中选择器的通用语法如下

$(selector)

或者

jQuery(selector)

其中，selector符合css标准，甚至css3的标准

例如：

$("#showDiv")

id选择器，这相当于javascript中，document.getElementById("shouDiv"),可以看到jQuery的变色方法简洁很多。

$(".newClass")

类别选择器，选择css类别为"newClass"元素的节点，在javascript要实现相同的选择，需要用for循环遍历整个DOM

$("p:odd")

选择所有奇数行的p元素，几乎所有的标记都可以使用 ":odd"和":even"选择奇偶的选择。

$("td:nth-child(1)")

选择所有表格行的第一个单元格，就是第一列。这在修改表格的某一列是非常有用的，不再需要一行行的遍历表格。

$("li>a")

子选择器，返回<li>下标记的<a>元素，不包括孙元素标记

$("a[herf$=pdf]")

属性选择器，选择所有超链接，并且这些链接是以pdf结尾的。有了属性选择器，可以很好的选择页面中各种特性的元素

转载于:https://www.cnblogs.com/ahthw/p/4231346.html

jQuery基础之（二）jQuery中的$相关推荐

1.jQuery基础语法 2.jQuery选择器、操作页面文档元素 3.jqueryDOM操作 4.jqueryCSS操作 5.Jquery事件 6.Jquery动画...
这周的学习让我初步了解到JQuery作为js库的封装的伟大性.Write less Do more 才是我们真正应该做到的! 1.jQuery基础语法 · 链式编程 $("#div1&quo ...
JQuery 基础：4.JQuery对象
1.Jquery对象就是通过jquery包装Dom对象后产生的对象 Dom对象要是想通过jquery进行操作,先要转换成jquery对象 jquery和dom不能互相直接调用对象 2.转换将jque ...
jQuery基础（二）
慕课网视频总结处理表单焦点表单处理事件focusin事件与focusout事件,同样用于处理表单焦点的事件还有blur与focus事件它们之间的本质区别: 是否支持冒泡处理举个简单的例子 &l ...
jQuery读书笔记二 jQuery中的事件与应用
1.实践中的冒泡现象: <style type="text/css">body{font-size:13px} .clsShow{border:#ccc 1px sol ...
Web前端学习：jQuery基础--3【jquery操作样式类名、添加元素、jQuery-CSS()方法】
目录 1.jquery操作样式类名代码演示二.添加元素 1.append()演示 2.prepend()演示 3.after()演示 4.before()演示三.jQuery-CSS()方法 1 ...
jquery基础锋利的jquery
jq对象 -> DOM对象: [index] / get(index) DOM对象 -> jq对象: $() 封装 DOM 选择器使用jq获取HTML中不存在的元素都是,不会报错,所以不 ...
《jQuery基础》总结
目前,互联网上最好的jQuery入门教材,是Rebecca Murphey写的<jQuery基础>(jQuery Fundamentals).这本书虽然是入门教材,但也足足有100多页.我 ...
jQuery基础知识整理
jQuery基础知识整理 jQuery简介什么是jQuery(了解) jQuery简化JS代码 jQuery的核心思想:"写的更少,但做的更多"(write less,do mo ...
JQuery 基础笔记
JQuery 基础笔记 1. jQuery 概述 1.1 jQuery 是什么? 1.2 jQuery 简单应用 1.3 jQuery 功能应用 1.4 jQuery 技术优势 1.5 jQuery ...
【Java Web开发指南】JQuery基础笔记
文章目录 JQuery 基础: 1. JQuery 基础:1. 概念2. 快速入门3. JQuery对象和JS对象区别与转换4. 选择器5. DOM操作6. 案例 JQuery 基础: 1. 概念: ...

jQuery基础之（二）jQuery中的$

jQuery基础之（二）jQuery中的$相关推荐

最新文章

热门文章