窥探jQuery——面向JavaScript程序员
2010-09-14 13:09:45 来源:WEB开发网在语言升级方面,jQuery提供了很多函数(功能),但每个函数都被赋给jQuery对象的属性:jQuery.each,jQuery.extend,jQuery.grep,jQuery.map,jQuery.merge以及jQuery.trim。如此一来,它们就不会跟其他代码产生冲突。
声名狼藉的$函数(The infamous $ function)
刚才我说到,jQuery是唯一被引入的全局标记,其实并不尽然:$标记作为jQuery的快捷方式,也被引入进来。庆幸的是,$的存在不会带来负面影响:如果你需要让原始的$起死回生(比如,这之前你的代码使用了Prototype),你可以调用jQuery.noConflict()来恢复它。
如果你既想拥有$的便利,又不希望jQuery跟其他同样使用了全局$函数的代码发生冲突,可遵循jQuery文档所建议的惯用方式:
(function($) {
// 在这个函数体里,$可作为jQuery的引用
// 很方便,对吧?
})(jQuery);
把一切都附加到$标记的做法,曾让我认为jQuery华而不实。不过,从体系的角度来审视这种设计,一切又是非常明了的——尽管我常喜欢在代码中定义自己的$快捷方式。
选取元素(Selecting some elements)
jQuery的每个操作,都以选取DOM中一个或更多的节点(nodes)作为开始。jQuery(拥有一种真正的面向特定领域)的选取语法,是十分有趣的,它结合了CSS 1,CSS 2,部分CSS 3语法,一些XPath语法,以及一些特定的扩展。在这里我不会做详细介绍,我只列出几个有用的例子:
jQuery('div.panel')
选取了所有class="panel"的div
jQuery('p#intro')
选取了所有id="intro"的段落
jQuery('div#content a:visible')
选取了id="content"的div中所有可见的链接
jQuery('input[@name=email]')
选取了所有name="email"的输入域
jQuery('table.orders tr:odd')
选取了类名为“orders”的表中所有的奇数行
jQuery('a[@href^="http://"]')
选取了所有(以http://开头的)外部链接
jQuery('p[a]')
选取了所有包含一个或多个链接的段落
更多精彩
赞助商链接