$号是jQuery“类”的一个别称,$()构造了一个jQuery对象。所以,“$()”可以叫做jQuery的构造函数(个人观点,呵呵!)。
 
1、$()可以是$(expresion),即css选择器、Xpath或html元素,也就是通过上述表达式来匹配目标元素。
比如:$("a")构造的这个对象,是用CSS选择器构建了一个jQuery对象——它选择了所有的<a/>这个标签。如:

$("a").click(function(){...})

就是在点击页面上的任何一个链接时的触发事件。确切地说,就是jQuery用<a/>这个标签构建了一个对象$("a"),函数
click()是这个jQuery对象的一个(事件)方法。 
 
 
比如有这样一段HTML代码:

复制代码
代码如下:
<p>one</p>
<div>

<p>two</p>
</div>
<p>three</p>

<a href="#" id="test" onClick="jq()" >jQuery</a>

而操作这段HTML的是如下一条语句:
alert($("div>p").html());

$()中的是一个查询表达式,也就是用“div>p”这样一个查询表达式构建了一个jQuery对象,然后的“html()”意思是显示其html内容,也就是上面HTML代码段的[two]。再如:

$("<div><p>Hello</p></div>").appendTo("body");

$()中的是一个字符串,用这样一段字串构建了jQuery对象,然后向<body/>中添加这一字串。

2、$()可以是$(element),即一个特定的DOM元素。如常用的DOM对象有document、location、form等。如这样一行代码:

$(document).find("div>p").html());

$()中的document是一个DOM元素,即在全文寻找带<p>的<div>元素,并显示<p>中的内容。

3、$()可以是$(function),即一个函数,它是$(document).ready()的一个速记方式。如常见的形式是这样的:

$(document).ready(function(){
alert("Hello world!");
});
可变形作:

$(function(){
alert("Hello world!");
});

对于选择HTML文档中的elements,jQuery有两种方法:
1)如$("div>ul
a"),它的意思是div标签中的ul标签中的a标签
不过,$('div>ul')和$('div ul')是有区别的,

$('div>ul')是<div>的直接后代里找<ul>;
而$('div
ul')是在<div>的所有后代里找<ul>。

2)用jQuery对象的几个方法(如方法find()、each()等)

$("#orderedlist).find("li") 就像 $("#orderedlist li").
each()一样迭代了所有的li,而表达式中的“#”表示HTML中的ID,如上例中的“#orderedlist”就表示“ID为orderedlist所在的标签”。

****************************************************************

1、标签选择器$('p')、类选择器$('.myClass')、id选择器$('#myId')相对简单,不多说。不过有一点——$('div>ul')和$('div
ul')是有区别的,
$('div>ul')是<div>的直接后代里找<ul>;而$('div
ul')是在<div>的所有后代里找<ul>。

所以,$('#sId>li')所选择的是id为"sId"的所有<li>孩子节点,即使这个<li>的后代还有<li>也不是它所找的范围(所找到的DOM对象,只是它本级的DOM对象。)。而$('#sId
li:not(.horizontal)'),就是指类名"sId"里面的所有li的子孙中没有horizontal类的所有元素。——这里的not()是一个negation
pseudo class.
这里返回的是一个jQurey对象,一个数组对象,这个jQuery对象的长度可用.length()得到。

2、XPath选择器
如:选择所有带有title 属性的链接,我们会这样写:$('a[@title]')

[]里带@,说明[]里的是元素的属性;是个属性选择器
[]里没@,说明[]里的是元素的子孙。
$('ul
li')和$('ul[li]')虽然返回的都是一个jQuery数组,但两者的含义正好相反。前者是要找<ul>下所有<li>子孙,而后者却是在找所有子孙为<li>的<ul>数组。

在XPath中,要找一个“以...开头”的属性,用^=,如找一个name属性是以mail开头的input元素,就用

$('input[@name^="mail"]')
要找一个“以...结尾”的属性,要用$=
要找一个“不头不尾”的属性,用*=

3、不属于上述的CSS和XPath的选择器,就是自定义的选择器了,用“:”表示,这里要用的就是:first,:last,:parent
,:hidden,:visible,:odd,:even,:not('xxx'),
":eq(0)"(始于0),:nth(n),:gt(0),:lt(0),:contains("xxx")

如:$('tr:not([th]):even')意为<tr>元素的子孙中不含<th>的所有子孙的偶数项

4、还有几个,简单不解释了
$('th').parent()——

$('td:contains("Henry")').prev()——内容包含有"Henry"的<td>的上一个节点

$('td:contains("Henry")').next()——内容包含有"Henry"的<td>的下一个节点

$('td:contains("Henry")').siblings()——内容包含有"Henry"的<td>的所有兄弟节点

还有一个,就是end(),这个方法肯定是用在某个DOM节点执行了某一动作之后,还想在与其相关的节点上执行类似动作,这里就要用到end()。用过end()方法之后,所返回的是执行动作的那个节点的父节点上。举个例子

$(...).parent().find(...).addClass().end()

这里执行动作的节点是find(...),是一个数组对象,它所做的动作是“addClass()”,之后,用了个end(),这时所返回的东东就是指向了parent()所指向的节点,也就是执行“addClass()”动作的那个数组对象的父节点。

5、要直接访问DOM元素,可用get(0)的方法,如

$('#myelement').get(0),也可缩写成$('#myelement')[0] 

转载 jQuery的三种$()的更多相关文章

  1. jquery()的三种$()

    jQuery中的$以及选择器总结 $号是jQuery”类”的一个别称,$()构造了一个jQuery对象.所以,”$()”可以看作jQuery的”构造函数”(个人观点). 一.$符号 1.$()可以是$ ...

  2. jQuery的三种$()

    参考脚本之家“http://www.jb51.net/article/21660.htm”   $号是jQuery“类”的一个别称,$()构造了一个jQuery对象.所以,“$()”可以叫做jQuer ...

  3. jQuery的三种写法

    jQuery的三种写法 jQuery一共有三种写法,写法如下: <script type="text/javascript" src="js/jquery-1.9. ...

  4. 转载Jquery中的三种$()

    1.$()可以是$(expresion),即css选择器.Xpath或html元素,也就是通过上述表达式来匹配目标元素. 比如:$("a")构造的这个对象,是用CSS选择器构建了一 ...

  5. (转载) jQuery 页面加载初始化的方法有3种

    jQuery 页面加载初始化的方法有3种 ,页面在加载的时候都会执行脚本,应该没什么区别,主要看习惯吧,本人觉得第二种方法最好,比较简洁. 第一种: $(document).ready(functio ...

  6. [转载]jquery版小型婚礼(可动态添加祝福语)

    原文链接:http://www.cnblogs.com/tattoo/p/3788019.html 前两天在网上不小心看到“js许愿墙”这几个字,我的神经就全部被调动了.然后就开始我 的百度生涯,一直 ...

  7. [转载]jQuery诞生记-原理与机制

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=3520 一.看似偶然的 ...

  8. 转载JQuery 获取设置值,添加元素详解

    转载原地址 http://www.cnblogs.com/0201zcr/p/4782476.html jQuery 获取内容和属性 jQuery DOM 操作 jQuery 中非常重要的部分,就是操 ...

  9. [转载]jQuery UI 使用

    最近项目中使用了一些插件来做页面,这里把jQuery UI的使用分享出来,希望 对新手有帮助.文章结尾附源码下载. 1     jQuery UI 2     为我所用 2.1     Tabs 2. ...

随机推荐

  1. JavaScript toFixed function Not Rouding

    JavaScript库函数toFixed用来将给定的数字四舍五入为指定的小数位数,W3school上有详细的介绍.众所周知,在处理小数位四舍五入的时候存在两种方式:一种是逢五进一,如5.885保留两位 ...

  2. [译]JavaScript中,{}+{}等于多少?

    最近,Gary Bernhardt在一个简短的演讲视频“Wat”中指出了一个有趣的JavaScript怪癖:在把对象和数组混合相加时,会得到一些你意想不到的结果.本篇文章会依次讲解这些计算结果是如何得 ...

  3. 简单理解ECMAScript2015中的箭头函数新特性

    箭头函数(Arrow functions),是ECMAScript2015中新加的特性,它的产生,主要有以下两个原因:一是使得函数表达式(匿名函数)有更简洁的语法,二是它拥有词法作用域的this值,也 ...

  4. 虚拟机锁定文件失败,开启模块snapshot失败解决办法

    今天由于没有正常关闭虚拟机,导致出现打开虚拟机提示:锁定文件失败 虚拟机开启模块snapshot失败,后来从网上找打了资料解决了.解决办法:一:打开你存放虚拟机系统文件的文件夹,注意,是系统文件,不是 ...

  5. Javascript正则表达式的初步学习

    <html> <head> <meta charset="utf-8"> <title>正则表达式的学习</title> ...

  6. ArcGIS Flex API加载大量数据

    1.关于大量数据的加载: 直接将所要展示的数据在服务器端发布成一个MapService,在客户端通过ArcGISDynamicMapServiceLayer来加载.这样的话客户端需要展示的仅仅是一张图 ...

  7. LoadRunner在移动端性能测试的应用

    摘选自 <精通移动app测试实战:技术.工具和案例>新书上市 如果大家之前做过性能测试,我相信一定会应用过大名鼎鼎的性能测试工具-LoadRunner.目前LoadRunner的最新版本为 ...

  8. IntelliJ IDEA 2016.2.4 最新版激活方法

    新版激活方法: 1.在线激活 2016年7月14日 更新: 该域名已无法激活,参见2016.2 的搭建授权服务器激活, 菜单help >>>> Register 选择Licen ...

  9. 基于apt实现的Android快速持久化框架:AptPreferences

    AptPreferences是基于面向对象设计的快速持久化框架,目的是为了简化SharePreferences的使用,减少代码的编写.可以非常快速地保存基本类型和对象.AptPreferences是基 ...

  10. [C#] zdbviewcs: 跨平台数据库查看器。支持SqlServer、Oracle、MySql等数据库

    作者:zyl910 一.说明 本工具有适合以下情况使用—— * 快速查看数据库中数据及表结构信息.* 测试ADO.Net下连接字符串的写法.* 帮忙分析ADO.Net数据库操作. 二.用法 运行本程序 ...