今天又出现了一个流行的 DOM/CSS/Javascript 项目：Greybox。它很像流行的 lightbox，但用于在当前页面上显示网站。

我认为这是一个很好的机会来展示用 jQuery 制作优秀代码的便捷性。我分两阶段修改了 greybox。

1. 第一步是使 greybox 能够非侵入式地工作（他们将 javascript 嵌入页面以使其工作）并修复了损坏的返回按钮（访问站点后必须点击两次返回按钮）。
2. 下一步是彻底改造库本身，并删除对 Amir 个人 Javascript 库的依赖——使其完全使用 jQuery 运行。最终的代码只有 1.2kb（与原始的 12kb 相比）。

一个演示和下载如果你有兴趣查看 jQuery 在实际应用中的一些示例，可以进行查看。享受！

Mark Panay 今天发布了一篇 优秀的文章，解释了使用 jQuery 对 Web 设计师的好处。具体来说，设计师如何通过使用 jQuery 来规避尚未在浏览器中实现的 CSS 功能。将多余的标记隐藏起来，非侵入式 Javascript 始终是一个明智的选择。

今天又有一篇 CSS/Javascript 文章在流传，名为：基于宽度的布局。其前提是页面根据浏览器的宽度自动调整宽度。文章中包含 38 行 Javascript 代码（我在这里说得很大方了），以完成这项工作。我将为你节省解释他们代码的麻烦，直接展示改进后的代码，如下所示。

$(window).resize(setWidth);
$(document).ready(setWidth);

function setWidth() {
  var de = document.documentElement;
  var w = (window.innerWidth || (de && de.clientWidth)
    || document.body.clientWidth) < 990 ?"alt":"main";
  $("#wrapper").addClass( w + "wrapper" );
}

你可以在这里找到这段新代码的 实时演示。具有讽刺意味的是，他们使用的是我写的一段 代码，但却没有署名。

我绝对最喜欢上面代码的部分是我正在进行的短路操作。那部分的原始代码来自 evolt 文章。我不知道是怎么回事，但每当我看到包含多个赋值的 IF 语句时，我的皮肤都会发麻。因此，以下

if (window.innerWidth)
{
	theWidth = window.innerWidth
}
else if (document.documentElement 
  && document.documentElement.clientWidth)
{
	theWidth = document.documentElement.clientWidth
}
else if (document.body)
{
	theWidth = document.body.clientWidth
}

将更改为

var de = document.documentElement;
var w = window.innerWidth || (de && de.clientWidth)
  || document.body.clientWidth;

如果你好奇为什么这能起作用，尝试运行以下语句

alert(1||0); // You get 1
alert(0||2); // You get 2
alert(0||(2&&1)); // You get 1
alert(0||(3&&4)||2); // You get 4

你将对那段（之前非常冗长的）代码中实际发生的事情有更清晰的认识。

Cody Lindley 今天联系我，让我知道他对 jQuery 的看法——以及一个 新的 jQuery 演示页面。如果你想了解 jQuery 代码的更多示例以及它可以实现的一些巧妙效果，你绝对应该查看一下。我在 jQuery 演示 页面上添加了指向他页面的链接。

我一直都在查看我的推荐日志和 Technorati，看看谁在谈论 jQuery。今天，我偶然发现了一个写了 关于如何使用 jQuery 的简短教程 的人。这个教程本身是相当新的（例如，没有直接从文档中借鉴任何内容）——所以如果你正在寻找更多示例代码，除了 当前教程 之外，还可以查看这里。

前几天，我在 DOM Scripting 博客上看到了一篇 文章，并看到了一个展示 jQuery 简洁性的绝佳机会，请观察

旧的 DOM 方式

function appendInputTypeClasses() {
  if ( !document.getElementsByTagName ) return;
  var inputs = document.getElementsByTagName('input');
  var inputLen = inputs.length;
  for ( i=0; i < inputLen; i++ ) {
    if ( inputs[i].getAttribute('type') ) {
      inputs[i].className += ' '+
        inputs[i].getAttribute('type');
    }
  }
}

新的 jQuery 方式

$("input").each(function(){
   $(this).addClass(this.type);
});

我甚至正在考虑实现一种绕过 each() 函数的新方法，请观察

$("input").addClass("{type}");

在 Javascript 代码方面，你真的无法比这更简短了。我还有很多其他的“旧”DOM 脚本示例，将在接下来的几天或几周内发布/改进。

根据 Mark（以及许多其他人）的要求，现在有了官方的 jQuery 邮件列表。我进行了一些简单的测试，以确保其正常工作，到目前为止，它运行良好。如果你在注册或发布消息时发现任何错误，请告诉我。请将问题或讨论保留在列表中，并将支持请求 直接发送给我。

我刚刚完成了一些额外的文档，以帮助所有正在学习如何使用 jQuery 的人。我要感谢 Bruno 帮助我解决了所有 Prototype/jQuery 的奇怪问题，并感谢 Derek 检查了选择器的差异。

• jQuery 基础模块。我编写了 $() 函数的具体工作原理，并将所有单个函数类型的文档分解到单独的页面中。
• jQuery 选择器。jQuery 最重要的部分之一是它快速选择不同 HTML 元素的能力。此页面展示了其工作原理以及 CSS 和 XPath 如何协同工作。
• 在 jQuery 中使用 CSS。此页面详细介绍了 CSS 1-3 规范之间的异同及其在 jQuery 中的实现方式。
• 在 jQuery 中使用 XPath。解释在 CSS 之上支持的 XPath 的基本方面。
• 自定义选择器。引入了一些自定义选择器，这些选择器在 CSS 或 XPath 中都不容易获得。
• 使用 Prototype 和 jQuery。最后，详细介绍了 jQuery 与 Prototype 一起使用时的工作原理、注意事项以及需要注意的事项。

我使用 jQuery 的下一个大目标是对代码进行调整，以提高速度和清晰度（感谢 Tim！），编写几个新插件，并为开发人员创建一个新的插件库。所有这些都将在接下来的几天或几周内推出。

Michael Geary 今天联系我，告诉我他已经完成了第一个第三方 jQuery 插件。他的 特定插件 加载一个远程 JSON 文件，然后可以对其进行进一步操作。这个特定请求的链接并没有带来太多好处，但我仍在进一步探索（也许 jQuery 可以支持 JSON 遍历，以及 DOM？）。

他的代码让我想起了我和 Jordan 在 BarCampNYC 上开始开发的一个模板/JSON 插件，它允许你导入外部模板代码。我很快就会提供有关此插件的更多详细信息（以及有关我正在开发的 AJAX 插件的更多详细信息，这是许多人的请求）。

我计划很快开设一个插件库，以便插件作者可以提交他们的代码，有一个区域用于文档和评论，并允许进行修补。有关此方面的更多详细信息，敬请期待。

我想要借此机会宣布 jQuery 博客。jQuery 在一周多前发布，反响热烈。它不仅登上了 del.icio.us 热门 页面，还登上了 digg 首页，这表明 Javascript 程序员多么渴望获得更好的库来编写代码。我将使用此博客详细介绍对代码所做的更改，宣布新功能，并提供大量实际示例。我已经准备了很多内容——我期待着推动它的发展！如往常一样，如果你对 jQuery 有任何问题，请随时 给我发送电子邮件。