用于跨浏览器脚本的“精简”JavaScript 框架？答案

【问题标题】："Thin" JavaScript framework for cross-browser scripting?用于跨浏览器脚本的“精简”JavaScript 框架？
【发布时间】：2011-03-24 23:11:34
【问题描述】：

是否有一个 JavaScript 框架专注于通过调整实现差异来扩展 JavaScript？我的意思不是简单地跨不同浏览器提供相同功能的框架，而是使非标准浏览器表现得好像它们符合标准的东西。

基本上，我想要对 JavaScript 做的事情就像 ie7.js 对 MSIE 所做的那样，或者 html5shiv 对于 HTML5 元素所做的事情。或者 Web Sockets 或 Canvas 的各种解决方法。

我想 jQuery 和它的同类可以解决这个问题，但我更喜欢允许我编写普通、符合标准的 JavaScript 的东西，就好像浏览器之间没有差异一样。

编辑：正如所有其他答案似乎都指出，是的，jQuery 是 JavaScript，是的，大多数 JavaScript 框架都试图提高跨浏览器的兼容性，让我澄清一下我的意思。

如今，跨浏览器的 JavaScript 实现之间的差异与语言本身没有太大关系。除了旧浏览器中缺少一些内置方法外，这些类型的行为也大多相同。但是仍然存在差异，尤其是在目前的现状（Chrome/Firefox/Safari）和 MSIE 的旧版本（即 MSIE 7）之间。最值得注意的是，DOM 的 API 往往具有或多或少的微妙特性。

我不想要一个框架，让我编写可以在大多数浏览器上运行的 JavaScript。那是一毛钱。我想要一个薄层，让我可以编写在现代浏览器和旧版浏览器中都可以使用的代码。 jQuery、Dojo 等都超越了这一点，提供了自己独特的 API，而不是统一现有的 API。

说“使用 jQuery”就像说如果我想避免跨浏览器呈现差异，我应该使用 Rich Ajax Platform（或其他代码生成框架）。我不想要一个“替代品”，我想要一个“错误修复”（不是字面意思）。

EDIT2：只是为了说明这一点：我不是在寻找任何框架。我对 jQuery 非常熟悉，已经尝试过 YUI，目前正在考虑尝试 Dojo。我不只是想要一个“好”的框架。我想要一个符合我非常具体的描述的。如果没有类似的东西也没关系，尽管知道为什么不会很有趣（即技术原因，而不是“每个人都忙于使用 jQuery”）。

【问题讨论】：

所有 javascript 框架都旨在最大限度地减少跨浏览器问题。
@Sarfraz，从概念上讲，是的。它们总是旨在跨不同的浏览器工作，但它们不是通过清理 API 而是通过提供自己的 API 来做到这一点的。
必须对所有“使用 jQuery”的答案感到沮丧。我知道你非常清楚 jQuery 及其类似的东西是什么以及做什么。
没有机会。 IE 不公开 DOM 节点的原型，因此如果不对每个单独的节点进行扩展，就无法扩展它们。我认为您不想在每次获得新节点引用时调用函数来标准化您的节点（例如var el = someNode.nextSibling; fixUp(el); var matchingEls = el.getElementsByClassName("someclass");）
我建议您阅读以下内容：perfectionkills.com/whats-wrong-with-extending-the-dom

标签： javascript ajax javascript-framework

【解决方案1】：

如果您的想法像您的帖子所暗示的那样极简主义，您可以尝试编译自己的微型库，该微型库为一些最常见的令人讨厌的分歧提供跨浏览器功能，例如 addEventListener 与 attachEvent、getTagsByClassName 与没有方法，滚动差异，窗口尺寸等。大多数 Javascript 差异实际上是 DOM 方法中的差异，并且列表虽然很长，但不必一次编译。添加您自己的跨浏览器功能，因为它们出现在您的编码中。

简单来说，使用 jQuery。

【讨论】：

【解决方案2】：

所有 JavaScript 库都试图通过允许您编写干净的跨浏览器兼容 JavaScript 代码来“公平竞争”。

一些最受欢迎的：

Prototype

MooTools

Scriptaculous

jQuery（我个人最喜欢的）

【讨论】：

我会通过向我指出几个体面的框架来为您提供帮助，但您的回答似乎完全忽略了我所说的我特别寻找的部分。不过，谢谢。

【解决方案3】：

没有机会完全实现您想要的。 IE 不公开 DOM 节点的原型，因此如果不对每个单独的节点进行扩展，就无法扩展它们。此外，通常（也许总是？）不可能覆盖主机对象的现有只读属性，例如 IE 中的 DOM 节点，因此您将无法修复 DOM 节点本身上错误实现的 DOM 属性。即使您只是修复 DOM 方法，每次获取新节点引用时，您仍然需要调用一个函数来执行此操作：

var el = someNode.nextSibling;
fixUp(el); // Adds missing methods to the element and fixes broken ones
var matchingEls = el.getElementsByClassName("someclass");

要获得关于为什么您想要的东西是不可能的非常好的详细解释，我建议您阅读以下内容：http://perfectionkills.com/whats-wrong-with-extending-the-dom/

【讨论】：

【解决方案4】：

我不相信有一个简单的“使浏览器行为正确”的框架——它们都超出了这个范围。

也就是说，重新发明轮子没有任何价值，因此最好将时间投入到 jQuery 之类的东西上（可能使用自定义的最小构建）等，同时确保为使用 JavaScript 的用户提供合理的回退已禁用。

【讨论】：

【解决方案5】：

问这个问题已经很久了，但也许它对某人有用：最近，金融时报的一组开发人员建立了一种通用的 polyfill，它只为不同的浏览器修补必要的部分..@ 987654321@

【讨论】：

【解决方案6】：

在编写“标准”JavaScript 时，我倾向于定义自己的函数来提供常用功能的跨浏览器实现。 addEvent 和 removeEvent（有几种实现）是这种技术的常见示例。我研究并编写了几个函数，使我能够针对特定问题调用一个函数，而不是每次都检测并执行正确的代码。

获取元素的高度、宽度和偏移量之类的操作需要针对不同浏览器的不同实现，但可以轻松写入函数并在任何需要的地方重复使用。

所以，我的“解决方案”主要是 DIY 解决方案。创建一个名为“utilities.js”的文件并根据需要开始添加功能。 addEvent、removeEvent 和跨浏览器 XMLHttpRequest 是一个很好的起点。在这里，我将开始：

function createXHR()
{
    var xhr;
    if (window.ActiveXObject)
    {
        try
        {
            xhr = new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch(e)
        {
            alert(e.message);
            xhr = null;
        }
    }
    else
    {
        xhr = new XMLHttpRequest();
    }

    return xhr;
}

该函数将返回一个 XMLHttpRequest 对象以供您根据需要使用。享受吧。

编辑：请注意，这种方法理论上可能会占用您的命名空间相当多的空间。您最好创建一个utilities 对象，然后调用utilities.createXHR。

【讨论】：

【解决方案7】：

如果我对您的理解正确，http://flowjs.com/ 应该与您要查找的内容非常接近。它的主要目标：“FlowJS 在所有现代浏览器中实现 DOM Level 3 API”

【讨论】：

【解决方案8】：

您可以使用 JQuery。使用 JQuery 使您能够以不同浏览器实现所缺乏的一致性查询 DOM。我想说的是，ajax 调用处理的是当今人们在 JavaScript 中处理的最大问题集。

【讨论】：

没错，但是 jQuery 让你编写 jQuery 代码。我正在寻找的框架可以让您以“应有的方式”（即普通）编写 JavaScript，但可以跨浏览器。
@Alan - 没有 jQuery 代码。 jQuery 是 JavaScript（它使用普通的旧 JavaScript 语法）。当您与 DOM 交互时，大多数跨浏览器问题都会出现，这正是 jQuery 选择器如此出色的原因。
我知道 jQuery 是 JavaScript，但它仍然鼓励一种与普通旧 JavaScript 完全不同的特定语法和代码结构。这就是我所指的。否则这个问题将毫无意义。
jQuery 不会“替换”JavaScript 样式；它取代了 DOM。 DOM 不是 JavaScript。
JQuery 没有使用特定的语法，它只是一个流畅的界面。如果有的话，JQuery 是一种用于操作 DOM 的 DSL。