Есть ли простой способ конвертировать jquery-код в javascript?

Question

Существует множество примеров достижения определенных вещей в javascript/dom с помощью jQuery. Однако использование jQuery не всегда является вариантом, который может помочь понять примеры javascript-решений, написанных в jQuery.

Есть ли простой способ конвертировать код jQuery в обычный javascript? Я думаю, без необходимости доступа или понимания исходного кода jQuery.

Answer 1

Самый простой способ - это просто узнать, как делать DOM, перемещаясь и используя простой DOM api (вы, вероятно, назовете это: обычный JavaScript).

Это может быть больно для некоторых вещей. (именно поэтому библиотеки были изобретены в первую очередь).

Googling для «javascript DOM traversing/manipulation» должен предоставить вам множество полезных (и некоторых менее полезных) ресурсов.

Статьи на этом сайте, являются довольно хорошо: http://www.htmlgoodies.com/primers/jsp/

И как Nosredna указывает в комментариях: не забудьте проверить во всех браузерах, потому что теперь JQuery не будет заниматься несогласованности для вас.

Answer 2

Книга Джереми Кита «DOM Scripting» - отличное введение в работу с Javascript и DOM. Я очень рекомендую, хотите ли вы использовать jQuery или нет. Хорошо знать, что происходит внизу.

Answer 3

Имеется несколько хороших книг. Мне нравится ppk на JavaScript. Вот C hapter 8 on the DOM.

Answer 4

Если вы хотите изучить javascript, посмотрите эти видеоролики Douglas Crockford. Они очень хороши.

1. The Javascript programming language: History, Language, Advanced Features, Platforms, Standards, Style [download slides]
   • See YUI blog entry
2. Theory of the DOM [download slides]
   • See YUI blog entry
3. Advanced Javascript: Inheritance, modules, debugging, efficiency, JSON [download slides]
   • See YUI blog entry

Answer 5

Есть простой способ преобразовать JQuery код в обычный JavaScript?

Нет, особенно если:

понимание примеров яваскрипта решений , написанных в JQuery [это] трудно.

JQuery и все рамки, как правило, упрощают понимание кода. Если это трудно понять, то ваниль Javascript будет пытка :)

Answer 6

Я вижу причину, никакого отношения к первоначальному сообщению, автоматически компилировать JQuery код в стандартный JavaScript:

16k - или что бы то ни с gzip'нутыми , миниатюрная библиотека jQuery - может быть слишком большой для вашего сайта, который предназначен для мобильного браузера. W3c рекомендует, чтобы все HTTP-запросы для мобильных веб-сайтов составляли не более 20k.

w3c specs for mobile

Так мне нравится кодирования в моем славном, немногословный, прикованного JQuery. Но теперь мне нужно оптимизировать для мобильных устройств. Должен ли я действительно вернуться и выполнить сложную, утомительную работу по переписыванию всех вспомогательных функций, которые я использовал в библиотеке jQuery? Или есть какое-то удобное приложение, которое поможет мне перекомпилировать?

Это было бы очень мило. К сожалению, я не думаю, что такая вещь существует.

Answer 7

Это даст вам 90% пути туда;)

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

Для Ajax, то Fetch API теперь supported on the current version of every major browser. Для $.ready(), DOMContentLoaded имеет near universal support. You Might Not Need jQuery дает эквивалентные нативные методы для других общих функций jQuery.

Zepto предлагает аналогичную функциональность, но весит 10 кг на молнии. Существуют специальные сборки Ajax для jQuery и Zepto, а также некоторые micro frameworks, но jQuery/Zepto имеют прочную поддержку, а 10KB - только ~ 1 секунду на модеме 56K.

Answer 8

Я только что нашел это довольно впечатляющий учебник о JQuery для преобразования яваскрипта из Jeffrey Way на Jan 19 2012*Copyright © 2014 Envato*:

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

Нравится нам это или нет, но все больше и больше разработчиков будучи , впервые представил миру JavaScript через jQuery. Во многих моделях эти новички - счастливые. Они имеют доступ к множеству новых API JavaScript, которые делают процесс DOM обход (что многие люди зависят от jQuery для) значительно проще. К сожалению, они не знают об этих API!

В этой статье мы рассмотрим множество общих задач jQuery, а преобразуем их в современный и унаследованный 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… 
    }); 
}); 

Вы должны смотреть.

Answer 9

Я знаю, что это старый поток, но есть отличный ресурс, показывающий собственный javascript-эквивалент jquery, он даже включает в себя примеры ES6. Это наиболее полное из того, что я нашел из других статей, посвященных этому вопросу.

jQuery to Vanilla JS