新的 jQuery API 浏览器

发布日期: 作者:

jQuery 团队继续推出更多工具和资源,使使用 jQuery 进行开发变得容易、高效和富有成效。jQuery 不断增长的工具列表中最新添加的是项目团队负责人 Jorn Zaefferer 的新 jQuery API 浏览器。

jQuery API Browser
访问:http://jquery.bassistance.de/api-browser/

jQuery API 浏览器提供了一个直观的界面,可以快速找到有关 jQuery 方法和属性的信息。其功能包括

  • 选项卡式导航
  • 类别树视图
  • 导航和主要内容的快速搜索
  • HTML 和 JavaScript 代码段的代码高亮显示
  • 允许您调整导航/内容窗格大小的垂直分隔符
  • 突出显示内容中选定的方法
  • 方法参数的样式化的工具提示

API 浏览器在线和离线下载均可使用。

jQuery 项目提供了一个全面且不断增长的资源列表,将为开发人员提供其网站开发所需的文档、教程和插件/小部件。

jQuery
https://jqueryjs.cn/

插件和 UI 小部件/控件
http://docs.jquery.com/Plugins

文档
http://docs.jquery.com/Main_Page
http://www.visualjquery.com/
http://jquery.bassistance.de/api-browser/

杂志
http://www.visualjquery.com/magazine/

邮件列表
https://jqueryjs.cn/discuss/

项目博客
https://blog.jqueryjs.cn/

学习资源
http://docs.jquery.com/Tutorials
http://www.learningjquery.com/
http://15daysofjquery.com/

关于
http://docs.jquery.com/Sites_Using_jQuery
http://docs.jquery.com/About/Contributors

不要忘记在 Digg 上Digg 这篇文章

jQuery 1.1.1

发布日期: 作者:

1.1 的错误修复版本现已准备好供所有人使用。在 1.1 发布后发现了一些奇怪的行为,需要尽快解决。如果您在使用 1.1 版本时遇到任何困难,请尝试这个新版本,看看您的问题是否已解决。

强烈建议您升级。

与往常一样,如果您对新版本有任何疑问或疑虑,请随时在jQuery 邮件列表 上进行讨论。如果您认为您发现了错误,请将其添加到错误跟踪器 中。

下载

jQuery 修复的每个错误都可以在主要的错误修复列表中找到。与本版本相关的最重要的错误修复如下

  1. 设置 css 属性的数值失败,例如:.css(“opacity”,0.5)(也发生在 zIndex、fontWeight 上)
  2. 使用 jQuery 对象的上下文调用 $(…, jqobj) 失败。
  3. 访问不存在元素上的属性会导致错误,例如:$(“#foobar”).attr(“id”)
  4. 调用 .load() 而不带回调会导致错误。
  5. 您无法取消使用 .trigger() 或 .click()(例如)触发的事件。
  6. .add() 将单个 DOM 元素添加到 jQuery 对象中时出现故障。
  7. 将未定义的值传递给 $.post() 会导致奇怪的错误发生。
  8. 在示例文档中访问子节点时无法正常工作。
  9. jQuery.isFunction() 无法以跨浏览器的方式可靠地确定函数。
  10. 在 IE 中触发 .click() 失败。
  11. 在大多数浏览器中,触发的点击处理程序被执行了两次。
  12. 传递到 $(“…”) 中的换行符会导致 Firefox 进入无限循环。
  13. 调用 $.post() 而不带任何数据会导致错误。
  14. 在子选择器之后调用后代选择器会导致奇怪的结果,例如:$(“ul > li ul”)
  15. 如果事件处理程序没有绑定到该事件,则触发的事件不会发生。

界面 1.1 发布

发布日期: 作者:

基于 jQuery 的流行拖放、动画和小部件库 Interface 刚刚发布了 1.1 版本,以配合 jQuery 1.1 的发布。

Interface Color Picker

关于此版本需要注意的两件事

  • 全新的 animateClass、animateStyle 和 animateColor 处理程序。您现在可以从一个特定的类动画到另一个类 - 以及从一种颜色动画到另一种颜色。
  • 可拖放元素和可排序元素的速度已大大提高。
  • 文档已全面修订,现在非常全面。
  • 下载区域 已经重新设计,并且完全交互式。
  • 有大量的演示可以查看。他们更新了许多现有的演示,并添加了一些全新的演示,例如:颜色选择器图像裁剪器全景视图 和一个文件夹树

总而言之,这是一个很棒的版本。如果您还没有机会试用 Interface,我建议您现在就尝试一下。

jQuery 生日:1.1、新网站、新文档

发布日期: 作者:

好消息,大家!今天是 jQuery 的一周年“生日”!(我是在一年前的今天,于纽约 BarCamp 上发布它的。)为了庆祝,我们准备了许多东西让您享受。

1) jQuery 1.1

这是一个很棒的版本 - 包含大量错误修复、巨大的速度提升 和对出色 API 的重大简化。强烈建议您升级以获得此版本的所有好处。

立即下载

升级指南

在从 1.0.4 升级到 1.1 之前,请阅读这些指南 - API 已发生了一些更改,这些指南详细说明了如何解决这些更改以及如何使用新的jQuery 1.0 兼容性插件 来保留 1.1 中的 1.0 风格功能。

新功能

  • 根据我们所有的统计jQuery 1.1 的选择器比 jQuery 1.0.4 中的选择器快 10-20 倍。这应该会在您的 jQuery 应用程序中带来显著的差异。
  • 常用的选择器,例如 div#iddiv .classtd:nth-child(1)div > div 速度都大大提高。这是一个天壤之别。尝试一下,您就会明白。
  • 您现在可以将函数作为属性或 css 属性的值传递。该函数被执行,其返回值被设置为该属性的值。例如
    // 1.0 Code
    $("a").each(function(){
        $(this).attr("href", "/item/" + this.id);
    }).show();
    
    // 1.1 Code
    $("a").attr("href", function(){ return "/item/" + this.id; }).show();
  • 您现在可以从事件处理程序本身内部取消绑定事件处理程序。这允许您拥有仅绑定特定执行次数的事件处理程序,例如
    $("button").click(function(e){
        // Unbind the event handler if a specific form is hidden
        if ( $("#submitForm").is(":hidden") ) {
            $(this).unbind( e );
        }
    });
  • 轻松绑定仅发生一次的事件(这将取代旧的 .oneclick() 功能)
    // Show a thank you message for a form submission, but only once
    $("form").one("submit",function(){
        $("#thankyou").show();
    });
  • 您现在可以设置元素的文本值(这与 .html() 不同,在 .text() 中,所有 HTML 都以文本形式显示)。
    $("pre").text("<b>Hello</b>, how are you?");
    
    // Result:
    <pre>&lt;b&gt;Hello&lt;/b&gt;, how are you?</pre>
  • 您现在可以使用自定义函数构建自己的过滤器。(这在 1.0 中存在,但文档描述得并不好。)
    // Find all divs whose parent isn't hidden
    $("div").filter(function(){
      return $(this).parent(":hidden").length > 0;
    });
  • 您现在可以将逗号分隔的选择器列表传递给以下过滤器函数
    filter、find、not、siblings、parents、children、next、prev。这允许您做一些非常酷的事情

    // Find all radio buttons, or checkboxes, in a form
    $("form input").filter(":radio, :checkbox");
    
    // Find the next element that's a span, or a div
    $(this).next("span, div");

2) 焕然一新的网站设计

jQuery Site Screenshot
jQuery 网站的设计终于得到了急需的改进。这是由出色的jQuery 设计团队 规划并由Nate Cavanaugh 实现的。设计团队计划进行全面重新设计/重构,但我们想要一些能够帮助我们从当前设计过渡到彻底改版的方案。希望您喜欢它 - 并且一定要感谢 Nate、Bradley 或 Skye 的出色工作!

3) 重构的文档

最近我们一直在努力做的一件事,就是真正将 jQuery 文档、教程和 API 整合在一起并分类,并将其放在一个集中的位置。这项工作的成果就是新的
http://docs.jquery.com/
所有 jQuery 文档都可以在这个集中位置找到 - 使您更轻松地找到所需的内容,并更快地完成工作。我们希望您喜欢这种新的结构,如果您有任何建议,请告诉我们,我们可以在其中添加什么内容来使其更好。

4) 一个秘密…

我们已经保留了这条消息一段时间,现在终于可以发布了…… **jQuery 图书正在筹备中!** 一家充满热情的出版商已经加入,作者们已经完成了四分之一的工作量。虽然还有一些细节需要完善,但我们会等它接近完成时再详细告知,目前看来,我们将在春季末/夏季初发布 **第一本 jQuery 图书!**

Blank Book

希望您喜欢这些内容——我们花费了大量的时间和精力来确保此次发布的卓越。请务必感谢 jQuery 团队 的每一个人,他们付出了很多时间和努力,使得此次发布取得圆满成功。

我将在明天发布一篇“State of the Query”文章,谈论 jQuery 在过去一年中的发展情况,而推广团队将发布几篇博客文章,介绍如何使用新的 jQuery 1.1。

感谢各位,让 jQuery 的第一年取得了非凡的成就。

jQuery 壁纸

发布于 作者

您好,您可能不认识我,我的名字叫 Nate,我是一名设计师/程序员。

我一直都在帮助寻找 bug,并参与网站设计方面的工作,虽然我不在团队名单中,但在名单写完之后我就开始提供了一些帮助。

总之,为了让 jQuery 在全世界范围内广为人知,我制作了一些极简主义壁纸,用来装饰您的桌面。

您可以在这里下载这些文件

jQuery MNML v1. (压缩包中的分辨率:640×480 至 1600×1200)
jQuery MNML v2. (压缩包中的分辨率:640×480 至 1600×1200)
jQuery MNML v3. (压缩包中的分辨率:640×480 至 1600×1200)

jQuery MNML v1
jQuery MNML v1.

jQuery MNML v2
jQuery MNML v2.

jQuery MNML v3
jQuery MNML v3.

享受!

选择器速度

发布于 作者

注意: Jack 已经 修复了这篇文章中提到的几乎所有问题——做得太好了!


我们一直推迟讨论新版 1.1 中 jQuery 选择器速度的问题,直到发布日期临近,但似乎这个过程已经被 提前了。既然已经尘埃落定,那就让我们来研究一下 jQuery 的选择器速度吧。

简而言之:在 jQuery 1.1 中,我们倾尽全力使 选择器速度飞快。事实上,根据我们进行的所有测试,我们的速度快于任何其他选择器库。在开发 1.1 版的过程中,Dean Edwards 的 cssQuery 远远超过了其他任何选择器库。它非常全面,而且速度极快。

今天,Jack Slocum 公布了他的新 DOMQuery 选择器库。简而言之:标准已经提高。他的库非常快,可能是目前最快的选择器库。

然而,在比较他的库和我们的库时,出现了一些我们想要澄清的错误。(Jack 和 jQuery 双方都犯了错误)(作为参考,这是我测试时使用的 比较套件。)

jQuery 完全支持所有属性选择器。
例如,[@foo]、[@foo=bar] 等等。值得注意的是,jQuery 在这种情况下使用的是 XPath 风格的语法。由于 Jack 的测试中没有考虑到这一点,因此看起来我们无法通过所有属性选择器测试。

我们的“elem:empty”运行良好。
您可以从 Jack 的测试中看到,所有选择器(除了 DOMQuery)都无法通过 :empty 测试——这主要是因为他将结果与 DOMQuery 进行比较,而 DOMQuery 的结果是错误的。规范规定,如果一个元素不包含任何子元素或文本节点,那么它就是空的。在这种情况下,似乎没有考虑到这一点。

[foo!=bar]、:first、:last 不属于任何规范。
……但它们存在于测试套件中。顺便说一下,jQuery 确实实现了 :first 和 :last,但没有实现 [foo!=bar](似乎只有 cssQuery 实现?)。总而言之,在您没有设计为做某件事的情况下,与其他人进行比较是非常奇怪的。

span:not(span.hl-code) 匹配什么?
这是一个奇怪的灰色地带,我还没有看到任何地方提到过,规范也无法澄清。最终的结果集应该是所有没有 hl-code 类别的 span 还是什么都没有,因为您已经过滤掉了所有 span?例如

// Finds nothing in both
span:not(span)
=> []

// Finds spans that don't have a class of 'foo', in both
span:not(.foo)
=> [ <span>, <span>, ... ]

// jQuery's interpretation of the combination:
$("span:not(span.foo)")
=> []

// DOMQuery's interpretation of the combination:
Ext.select("span:not(span.foo")
=> [ <span>, <span>, ... ]

我们完全承认在这方面可能犯了很大的错误——但我很好奇地想知道其他人怎么说,以及他们对规范的解释是什么。

DOMQuery 没有考虑到重复项。
目前,执行 Ext.select(“div div”) 返回的元素数量比只执行 Ext.select(“div”) 返回的元素数量还要多——执行 Ext.select(“div div div”) 返回的元素集又有所不同,但仍然比只执行 Ext.select(“div”) 返回的元素数量多。事实上,考虑到重复项是 JavaScript 选择器库中一个巨大的问题——而目前,只有 jQuery 做对了。

一个重要的问题是,考虑到重复项可能会非常昂贵(从计算的角度来看)——因此,DOMQuery 没有考虑到重复项,这就给人们一种速度提升的错觉。例如

// DOMQuery
Ext.select("div").elements.length
=> 246
Ext.select("div div").elements.length
=> 624
Ext.select("div div div").elements.length
=> 523

// jQuery
jQuery("div").length
=> 246
jQuery("div div").length
=> 243
jQuery("div div div").length
=> 239

DOMQuery 不支持多个过滤器:elem.foo[foo=bar] 或 elem.foo.bar
在实现这一点之前,与任何其他库进行比较都是不公平的。构建一个能够完全处理这些方面(例如:cssQuery、jQuery)的库需要付出巨大的代价。(无论是代码大小还是速度成本。)

DOMQuery 的 #id 选择器不检查上下文
您会注意到,如果您尝试执行类似以下的查询

Ext.select("div #badid").elements
=> [div#badid]

您会得到一个名为“badid”的元素——即使该元素实际上并不在 div 内部。由于 DOMQuery 代码中实际上没有进行有效性检查,因此它的速度非常快,但结果也非常错误。

我应该提到,在 1.1 版之前,jQuery 在这一点上也是错误的,因此这是一个很容易忽视的问题。

根元素去哪了?
您会发现,在 DOMQuery 中搜索“html”和“*”奇怪地缺少了一件显而易见的事情:HTML 元素。从所有查询中排除根 DOM 元素似乎有点奇怪;尤其是考虑到这一点是完全有效的:“html > body *”。

……为了公平起见——这里有一个关于我们自己的问题 :-)

我们的 :nth-child(even/odd) 有缺陷。
目前,它似乎只选择一个元素 (!?)。我已经为此提交了一份 工单,这个问题应该会在本周日发布的 1.1 版中得到解决。

总而言之,看到 DOMQuery 取得的速度飞跃真是太好了。选择器速度是竞争真正有意义的一个领域;每当出现新的速度提升时,每个人都会从中受益(用户、开发人员——所有人)。

事实上,查看了他的代码后,我已经有了一些关于如何提高 jQuery 速度的新想法!

所以,Jack:感谢您帮助我们保持警醒——我们期待着看到您的库不断改进,并让每个人都从中受益。

jQuery 1.1b

发布于 作者

我们即将发布 1.1 正式版,就在本周日——为了让您等待的时间不那么难熬,我们发布了另一个 bug 修复集,供您进行测试。jQuery 开发团队一直在不懈努力地修复本周收到的所有支持请求,我们在修复几乎所有遇到的问题方面取得了很大成功。

如果您能花点时间用您的代码测试新的 1.1b 版,并且发现任何 bug,请务必 提交到 bug 跟踪器。

然而,这不仅仅是 bug 修复;我们还为您提供了一个新功能:**jQuery 1.0 兼容性插件**。正如承诺的那样,这个插件提供了 1.0.4 版中包含的所有方法和选择器。因此,理论上,您应该可以将 jQuery 1.1 和新的兼容性插件一起使用,并且一切都能正常工作。

以下是如何在 jQuery 1.1 中使用兼容性插件

<html>
<head>
  <script src="jquery-1.1.js"></script>
  <script src="jquery.compat-1.0.js"></script>
  <script>
    $(document).ready(function(){
        // Your old 1.0-centric code
    });
  </script>
</head>
<body></body>
</html>

因此,虽然您完全可以在可预见的将来继续使用兼容性插件,但强烈建议您遵循之前提到的 升级计划

因此,再次强调:**请帮助我们测试这个测试版!** 您参与测试得越多,最终发布的 1.1 版就会越好。感谢您的帮助!

下载

更新: 我忘记提了几件事(这就是我凌晨 4 点发布版本的后果)

  • .filter([“.foo”, “.bar”]) 现在是 .filter(“.foo, .bar”):一个更简单的解决方案——兼容性插件中已经修复了这个问题。
  • . 我们决定保留 .height() 和 .width()。它们又回来了,因为它们非常有用。
  • 文档 已更新至 1.1b 版(因此,对于那些仍然看到 .filter([...]) 或没有看到 .height() 和 .width() 的人来说——现在已经修复了。)

jQuery 1.1a

发布于 作者

正如 之前宣布的那样,今天我们发布了 jQuery 1.1 的 alpha 版。我们非常感谢您能帮助我们测试这个 alpha 版,这样我们就能在本周末发布一个稳定的版本——正好赶上 jQuery 一周年纪念日!(1 月 14 日)

这是一个非凡的版本。事实上,这个版本非常棒,我们将用整整一周的时间来告诉您有哪些新功能,以及如何最佳地使用它们。推广团队准备了一系列内容,帮助您快速上手,并准备使用这个出色的新版本 jQuery。

以下是关于 jQuery 1.1 的快速概览

  • 它的选择器比 jQuery 1.0.4 中的选择器快 10-20 倍。
  • 文档 已经完全翻新。
  • API 的复杂性下降了 47%
  • 它修复了大量的 bug。
  • 它包含了许多出色的新功能。
  • ……而且它仍然是您所熟悉的小巧的 19KB 文件。

我们将在接下来的几天内详细介绍所有内容,但目前看来,这是一个非常棒的版本。

下载

API 变更

注意: 我们将在本周末 jQuery 1.1 正式发布时,与之一起发布一个向后兼容插件。

重要的是要注意,API 发生了很多变化。 一些是添加,另一些是重组。 如果你想帮助我们测试这个 alpha 版本,请记住这些变化。

:nth-child() 现在从 1 开始,而不是 0。 我们对 CSS 3 选择器的实现是从 0 开始编号,而不是 1。 这是一个错误修复,但可能会影响你的代码。

// 1.0.x: Get the first column from a table
$("td:nth-child(0)")

// 1.1: Get the first column from a table
$("td:nth-child(1)")

以下方法在此版本中已重命名/重组,以下是如何继续使用它们,就像你预期的那样

旧方式 (1.0.x) 新方式 (1.1)
.ancestors() .parents()
.width() .css(“width”)
.height() .css(“height”)
.top() .css(“top”)
.left() .css(“left”)
.position() .css(“position”)
.float() .css(“float”)
.overflow() .css(“overflow”)
.color() .css(“color”)
.background() .css(“background”)
.id() .attr(“id”)
.title() .attr(“title”)
.name() .attr(“name”)
.href() .attr(“href”)
.src() .attr(“src”)
.rel() .attr(“rel”)
.oneblur(fn) .one(“blur”,fn)
.onefocus(fn) .one(“focus”,fn)
.oneload(fn) .one(“load”,fn)
.oneresize(fn) .one(“resize”,fn)
.onescroll(fn) .one(“scroll”,fn)
.oneunload(fn) .one(“unload”,fn)
.oneclick(fn) .one(“click”,fn)
.onedblclick(fn) .one(“dblclick”,fn)
.onemousedown(fn) .one(“mousedown”,fn)
.onemouseup(fn) .one(“mouseup”,fn)
.onemousemove(fn) .one(“mousemove”,fn)
.onemouseover(fn) .one(“mouseover”,fn)
.onemouseout(fn) .one(“mouseout”,fn)
.onechange(fn) .one(“change”,fn)
.onereset(fn) .one(“reset”,fn)
.oneselect(fn) .one(“select”,fn)
.onesubmit(fn) .one(“submit”,fn)
.onekeydown(fn) .one(“keydown”,fn)
.onekeypress(fn) .one(“keypress”,fn)
.onekeyup(fn) .one(“keyup”,fn)
.oneerror(fn) .one(“error”,fn)
.unblur(fn) .unbind(“blur”,fn)
.unfocus(fn) .unbind(“focus”,fn)
.unload(fn) .unbind(“load”,fn)
.unresize(fn) .unbind(“resize”,fn)
.unscroll(fn) .unbind(“scroll”,fn)
.ununload(fn) .unbind(“unload”,fn)
.unclick(fn) .unbind(“click”,fn)
.undblclick(fn) .unbind(“dblclick”,fn)
.unmousedown(fn) .unbind(“mousedown”,fn)
.unmouseup(fn) .unbind(“mouseup”,fn)
.unmousemove(fn) .unbind(“mousemove”,fn)
.unmouseover(fn) .unbind(“mouseover”,fn)
.unmouseout(fn) .unbind(“mouseout”,fn)
.unchange(fn) .unbind(“change”,fn)
.unreset(fn) .unbind(“reset”,fn)
.unselect(fn) .unbind(“select”,fn)
.unsubmit(fn) .unbind(“submit”,fn)
.unkeydown(fn) .unbind(“keydown”,fn)
.unkeypress(fn) .unbind(“keypress”,fn)
.unkeyup(fn) .unbind(“keyup”,fn)
.unerror(fn) .unbind(“error”,fn)

我知道这是一个很长的列表——但你会惊讶地发现,有多少人根本没有使用这些方法。 通过移除所有这些方法,我们已经能够将 jQuery API 的大小减少了 47%。 我们将提供更多关于 API 变更的详细信息,但现在,这个列表应该可以帮助你找出代码中的任何重大差异。

如果你有任何问题,请随时在下面的评论中发布,我们会立即为你解答。