语法

公鸡酸是“准备事件”的简称 鸡酮酸的断行性和链性 嵌套过滤器由Nathan Long 缓存一个集合并通过roosteronacid在同一行上执行命令 包含选择器roosteronacid 定义元素创建时的属性 访问jQuery函数就像访问roosteronacid数组一样 noConflict函数- Oli释放$变量 通过nickf隔离noConflict模式下的$变量 无冲突模式由鸡酮酸

数据存储

数据函数-通过TenebrousX将数据绑定到元素 HTML5数据属性支持,在类固醇!由roosteronacid Filip dupanovic设计的jQuery元数据插件

优化

用鸡酮酸优化复合选择剂的性能 lupefiasco的上下文参数 Nathan Long的保存和重用搜索 创建HTML元素并保持引用,检查元素是否存在,编写自己的选择器

杂项

Check the index of an element in a collection by redsquare Live event handlers by TM Replace anonymous functions with named functions by ken Microsoft AJAX framework and jQuery bridge by Slace jQuery tutorials by egyamado Remove elements from a collection and preserve chainability by roosteronacid Declare $this at the beginning of anonymous functions by Ben FireBug lite, Hotbox plug-in, tell when an image has been loaded and Google CDN by Colour Blend Judicious use of third-party jQuery scripts by harriyott The each function by Jan Zich Form Extensions plug-in by Chris S Asynchronous each function by OneNerd The jQuery template plug-in: implementing complex logic using render-functions by roosteronacid


当前回答

尽可能使用过滤方法而不是伪选择器,这样jQuery就可以使用querySelectorAll(这比sizzle快得多)。考虑这个选择器:

$('.class:first')

同样的选择可以使用:

$('.class').eq(0)

哪个必须更快,因为初始选择'.class'是QSA兼容

其他回答

创建一个HTML元素并保留一个引用

var newDiv = $("<div />");

newDiv.attr("id", "myNewDiv").appendTo("body");

/* Now whenever I want to append the new div I created, 
   I can just reference it from the "newDiv" variable */

检查元素是否存在

if ($("#someDiv").length)
{
    // It exists...
}

编写自己的选择器

$.extend($.expr[":"], {
    over100pixels: function (e)
    {
        return $(e).height() > 100;
    }
});

$(".box:over100pixels").click(function ()
{
    alert("The element you clicked is over 100 pixels height");
});

无用的模式

jQuery.noConflict();

运行此函数将$变量的控制权交还给第一个实现它的库。这有助于确保jQuery不会与其他库的$ object冲突。 通过使用这个函数,你将只能通过jQuery变量访问jQuery。例如,你过去做$("div p"),你现在必须做jQuery("div p")"。

而不是使用不同的别名为jQuery对象(当使用noConflict),我总是写我的jQuery代码包装在一个闭包。这可以在文档中完成。现成的函数:

var $ = someOtherFunction(); // from a different library

jQuery(function($) {
    if ($ instanceOf jQuery) {
        alert("$ is the jQuery object!");
    }
});

或者你可以这样做:

(function($) {
    $('...').etc()    // whatever jQuery code you want
})(jQuery);

我觉得这个最方便携带。我一直在一个同时使用Prototype和jQuery的网站上工作,这些技术避免了所有的冲突。

似乎大多数有趣和重要的技巧都已经提到了,所以这一点只是一个小小的补充。

这个小技巧就是jQuery。每个(对象,回调)函数。每个人都可能使用jQuery.each(回调)函数来遍历jQuery对象本身,因为这很自然。jQuery。每个(对象,回调)实用程序函数迭代对象和数组。在很长一段时间里,除了不同的语法之外,我不知道它能做什么(我不介意写所有时髦的循环),我有点惭愧,直到最近我才意识到它的主要优点。

问题是,自从jQuery的循环体。每个(对象,回调)是一个函数,每次在循环中都获得一个新的作用域,这在循环中创建闭包时尤其方便。

换句话说,一个典型的常见错误是这样做的:

var functions = [];
var someArray = [1, 2, 3];
for (var i = 0; i < someArray.length; i++) {
    functions.push(function() { alert(someArray[i]) });
}

现在,当您调用函数数组中的函数时,您将得到三次警报,内容为undefined,这很可能不是您想要的。问题是只有一个变量i,而所有三个闭包都指向它。当循环结束时,i的最终值是3,somearray[3]是未定义的。你可以通过调用另一个函数来为你创建闭包。或者你使用jQuery实用工具,它基本上会为你做:

var functions = [];
var someArray = [1, 2, 3];
$.each(someArray, function(item) {
    functions.push(function() { alert(item) });
});

现在,当您调用这些函数时,您将得到三个内容为1、2和3的警报。

一般来说,没有什么是你自己不能做的,但拥有它是很好的。

明智地使用第三方jQuery脚本,如表单字段验证或url解析。有必要了解一下它的内容,以便下次遇到JavaScript需求时了解情况。