有没有一种简单的方法可以将jquery代码转换为javascript？[关闭]

142

有很多示例可以使用jQuery在javascript / dom中实现某些功能。但是，使用jQuery并非总是一种选择，它会使理解jQuery编写的javascript解决方案的示例变得困难。

有没有一种简单的方法可以将jQuery代码转换为常规javascript？我猜不必访问或理解jQuery源代码。

javascript jquery code-conversion

— 大卫
source

8

我基本上是在将1条jquery行转换为10条普通javascript行之后...对于jquery不可用的情况...

— davidsleeps

1

即使您不能使用脚本标签来包含jQuery，也始终可以在源文件之前添加一个缩小的版本。我看不出除了某种公司政治之外无法使用jQuery的任何原因。

— cdmckay 2009年

23

我也可以看到很好的用处。Suppoe在jQuery的javascript中仅使用约10-100行。通过将函数重新编译并替换为核心方法，可以节省带宽，因此不会从jQuery加载其他所有内容。

5

我有同样的问题。许多人回答说jQuery更简单，但是已经熟悉JavaScript的开发人员在理解jQuery中的符号/缩写时会遇到一些问题。我问的原因是，由于某种原因，我得到的jQuery脚本无法在Blackberry中使用。这是一个Ajax上传脚本。所以我想我需要将其翻译为Javascript :(

1

我正在尝试在现有应用程序中进行JS合并，如果我包含jQuery，则该应用程序的所有内置JS函数都会中断。这是一个写得不好的应用程序（Atlassian的JIRA），我敢肯定他们应该对此负责，但是我需要同样的方法。

— chadoh 2011年

41

最简单的方法是仅学习如何使用普通的DOM api进行DOM遍历和操作（您可能会称之为：普通JavaScript）。

但是，这在某些方面可能会很痛苦。（这就是为什么首先发明图书馆的原因）。

搜寻“ javascript DOM遍历/操纵”应该会为您提供大量有用的（和一些不太有用的）资源。

该网站上的文章相当不错：http : //www.htmlgoodies.com/primers/jsp/

正如Nosredna在评论中指出的那样：请确保在所有浏览器中进行测试，因为现在jQuery将不再为您处理不一致问题。

— 皮姆·贾格（Pim Jager）
source

4

而且，您必须确保针对每个浏览器的不同版本进行测试。

— Nosredna

1

桌面工作站的选择如何影响jQuery的使用？

— 丹·戴维斯·布拉基特

5

我对某些组织使用开源库的政治观点表示同情。最后，您花费的时间纯粹是（很可能是错误的）重写为普通的DOM遍历，而JS为公司浪费了金钱。您可能会假设大型公司（包括非常保守的公司）使用jQuery：docs.jquery.com/Sites_Using_jQuery：Oracle，Google，Amazon，Dell，美国银行，Intuit，Salesforce。这些几乎不是嬉皮共产主义公司。这些是非常真实的公司，其法律部门可能已经完成了功课并接受了jQuery ...

— artlung

2

@davidsleeps-jQuery已被Microsoft认可...它已包含在Visual Studio 2008中，从技术上讲，它使其成为“ Microsoft”工具。那会让你的老板感觉好些吗？

— 罗伯特·哈维

4

jQuery和您编写的执行相同操作的一堆JavaScript之间对您的公司有何不同？它不像您要安装任何东西，使用新语言编码或添加任何依赖关系。老实说，这是我听过的最愚蠢的事情，允许使用javascript但不允许使用jQuery。jQuery是JAVASCRIPT！

— micmcg

60

这将为您提供90％的解决方案；）

window.$ = document.querySelectorAll.bind(document)

对于Ajax，现在每个主流浏览器的版本都支持 Fetch API。对于，具有近乎普遍的支持。您可能不需要jQuery为其他常见的jQuery函数提供了等效的本机方法。 $.ready()DOMContentLoaded

Zepto提供类似的功能，但压缩后的重量为10K。有针对jQuery和Zepto的自定义Ajax构建以及一些微框架，但是jQuery / Zepto具有可靠的支持，在56K调制解调器上10KB仅约1秒。

— 乱伦
source

22

http://net.tutsplus.com/tutorials/javascript-ajax/from-jquery-to-javascript-a-reference/

无论我们是否喜欢，越来越多的开发人员都首先通过jQuery引入了JavaScript领域。在许多方面，这些新来者都是幸运的。他们可以访问大量新的JavaScript API，从而使DOM遍历过程（很多人依赖jQuery的过程）变得相当容易。不幸的是，他们不了解这些API！

在本文中，我们将处理各种常见的jQuery任务，并将它们转换为现代JavaScript和旧版JavaScript。

我在对OP的评论中提出了此建议，在他提出建议后，我发布了对所有人都可以参考的答案。

此外，杰弗里·韦（Jeffrey Way）提到的有关他的灵感的巫婆似乎是理解的一个很好的入门：http : //sharedfil.es/js-48hIfQE4XK.html

有一个预告片，此文档将jQuery与javascript比较：

$(document).ready(function() {
  // code…
});

document.addEventListener("DOMContentLoaded", function() {
  // code…
});

$("a").click(function() {
  // code…
})

[].forEach.call(document.querySelectorAll("a"), function(el) {
  el.addEventListener("click", function() {
    // code…
  });
});

你应该看看。

— 米歇尔·帕特恩（Milche Patern）
source

12

我知道这是一个旧线程，但是有一个很好的资源显示了与jquery等效的本机javascript，它甚至包括ES6示例。这是我在涉及该主题的其他文章中找到的最全面的一篇。

jQuery转换为Vanilla JS

— 担
source

6

有没有一种简单的方法可以将jQuery代码转换为常规javascript？

否，尤其是在以下情况下：

很难理解用jQuery编写的javascript解决方案的示例。

JQuery和所有框架都倾向于使理解代码更容易。如果这很难理解，那么香草javascript会受到折磨:)

— 瑞安·佛罗伦萨（Ryan Florence）
source

15

其他人有实际答案

— 踩水了

2

同样，尽管JQuery通常使代码更简洁，但是是否实际上使它变得更容易争论。jQuery可以使某些代码更难于从精神上进行解析。例如，<input onclick="myfunction(this)">用myfunction(field){ field.value = "3"; }更有意义比我<input id='thing'>用(function ($) { $(thing).click({ $(thing).val("3");});})()

— liljoshu

6

我可以看到一个与原始帖子无关的原因，可以将jQuery代码自动编译为标准JavaScript：

16k-或压缩后的最小化jQuery库是什么-对于您打算用于移动浏览器的网站来说可能太多了。w3c建议对移动网站的所有HTTP请求最大为20k。

w3c手机规格

因此，我喜欢在我的简洁，链式jQuery中进行编码。但是现在我需要针对移动设备进行优化。我真的应该回去做一些艰巨而繁琐的工作来重写我在jQuery库中使用的所有辅助函数吗？还是有某种方便的应用程序可以帮助我重新编译？

那太好了。可悲的是，我认为这样的事情不存在。

6

如果您想学习JavaScript，请观看这些道格拉斯·克罗克福德视频。他们很好。

— 波波波波
source

2

话题不大，但克罗克福德的演讲通常都很棒。

— Indolering

1

杰里米·基思（Jeremy Keith）的书“ DOM脚本 ”是使用Javascript和DOM的精彩介绍。无论您是否要使用jQuery，我都强烈推荐它。很高兴知道下面发生了什么。

— 强壮
source

1

有几本好书。我喜欢JavaScript上的ppk。这是DOM的第8章。

— 诺斯雷德纳
source