Функции jQuery, эквивалентные в чистом JavaScript

Я ищу доктора со всеми функциями jQuery и их эквивалентами в ПЧЕЛЕ, обеспеченной с рождения браузерами.

Когда-то мне только нужна определенная функция jQuery ( .detach() , .insertAfter() , .on() ...), и я загружаю jQuery только для этого.

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

Есть ли что-то вроде этого где-нибудь в сети?

Отредактируйте:

I found it : http://youmightnotneedjquery.com/

5
nl ja de
"Есть ли что-то вроде этого где-нибудь в сети?" просто посмотрите источник сценария jQuery: ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.js
добавлено автор A. Wolff, источник
Если вы спрашиваете меня, that' s большая работа ни для какой практической выгоды.
добавлено автор JJJ, источник
I' ve удалил ваши ссылки на ЧИСТЫЙ как он isn' t, что вы, кажется, думаете, что это.
добавлено автор Quentin, источник
Этот вопрос не имеет никакого смысла. Если вы хотите изучить, как определенная функция jQuery работает, вы изучаете родные манипуляции DOM, вы учитесь, как jQuery работает (смотря на его исходный код), и вы строите свою собственную автономную функцию. Источник jQuery - доктор для того, как он работает. Нет никакого отдельного доктора.
добавлено автор jfriend00, источник
There' s ничто неотъемлемо плохо об использовании jQuery. It' s очень легкий, когда эти дела идут. На самом деле, Google CDN делает его настолько удобным что you' d приходится, нелегко оправдывая не использование его.
добавлено автор Blazemonger, источник
Чтобы не придраться к мелочам, но технически написание вещей в jQuery - чистый JavaScript:)
добавлено автор jbabey, источник
@Yukulé lé - I' ve создал некоторые отрывки JavaScript, которые эквивалентны функциям jQuery you' ve требуют. Они должны способствовать вам и использованию чистого JS.
добавлено автор Louis Ricci, источник
jQuery - очень хороший lib, я узнал, что некоторые думают о JS с ним. Но сегодня у браузеров есть прочный общий API, делающий jQuery, не очень обязательный для некоторого основного использования. Но с практикой, трудно избавиться от этой привычки.
добавлено автор Yukulélé, источник
это имеет смысл. jQuery (для меня) как велосипедные колеса стабилизатора, очень хорошие, чтобы изучить серьезный JS, но некоторое время it' s не необходимый. читайте более здесь: youmightnotneedjquery.com
добавлено автор Yukulélé, источник

4 ответы

Вы только вызываете те функции jQuery после получения $ объекта jQuery (ОТБОРЩИК). Если вы говорящий вас не нуждаетесь в коде отборщика jQuery и просто хотите функции, которые берут (возможно), HTML элемент DOM, необходимо было бы разорвать его из исходного кода jQuery (http://code.jquery.com/jquery-latest.js), с зависимостями и просто размером и сложностью это может быть болезненным процессом.

Эквиваленты JS:

.detach - .removeChild

var par = elm.parentNode;
par.removeChild(elm);

.insertAfter - .insertBefore How to do insert After() in JavaScript without using a library?

function insertAfter(referenceNode, newNode) {
    referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}

.on - addEventListener/attachEvent

if(elm.addEventListener)
    elm.addEventListener(EVENT_NAME, function() {}, false);
else
    elm.attachEvent('on' + EVENT_NAME, function() {});

Теперь, если вы хотите связать события так, чтобы у укладчика была ЭТА ссылка на конкретный объект...

function bind( scope, fn ) {
    return function() {
        fn.apply( scope, arguments );
    };
}
if(elm.addEventListener)
    elm.addEventListener(EVENT_NAME, bind(SCOPE_OBJECT, function(){}), false);
else
    elm.attachEvent('on' + EVENT_NAME, bind(SCOPE_OBJECT, function(){}));
6
добавлено
+1. Лично для связывают, I' d проверяют на fn.bind и используйте, это прежде, чем сделать fn.apply .
добавлено автор Paul S., источник

Если вы также ищете ту же самую устаревшую поддержку, то не, нет такой вещи по многим причинам, таким как:

    повторные использования jQuery <лития> многие из него - методы внутренне, таким образом, вам придется, нелегко находя единственный, независимый вызов API. jQuery <лития> часто осуществляет многократные проверки поддержки, поддерживает ли браузер с рождения метод прежде, чем применить отступления для устаревшей поддержки. Необходимо будет сделать то же самое.

Однако вы могли бы быть в состоянии вытащить отдельные методы и сделать правильное внедрение ванили, просматривая исходный код в GitHub: https://github.com/jquery/jquery но это было бы довольно отнимающим много времени.

Однако много, много dom манипуляций так просты, что вам не нужен jQuery во-первых, такой как добавление класса:

elem.className += 'class'

Но инженерный анализ jQuery не был бы умным способом избавиться от зависимости jQuery.

2
добавлено
Обратите внимание, что jQuery проверяет на случаи края, которые не немедленно очевидны, например .addClass (' class') сначала проверяет, есть ли у элемента уже тот класс и doesn' t добавляют его в этом случае.
добавлено автор JJJ, источник
Положительная сторона @Juhana, и это точно, что я имею в виду. Если вы "переводите" методы jQuery на ваниль JS, вы, вероятно, заканчиваете с менее удобочитаемым кодом, который проверяет на случаи, который никогда не относится к вам так или иначе. IMO самого главного выпуска jQuery - то, что можно написать более тонкий код, который удовлетворяет и стилю кодирования проекта (хотя я не лично поклонник ванили).
добавлено автор David, источник

Возможно, вы ищете исходный код jQuery?

http://docs.jquery.com/Source_Code

1
добавлено
250 килобайтов кода не документ или полезный как ссылка.
добавлено автор Quentin, источник
И когда вы сделали это, вы по существу воссоздали бы jQuery. Это стоило бы усилия?
добавлено автор Frédéric Hamidi, источник
Да, но некоторая функция jQuery использует другой jQuery общественные/частные функции jQuery, и требуется некоторое время, чтобы распутать и воссоздать чистую функцию pur-js
добавлено автор Yukulélé, источник

Я никогда не видел тот. jQuery заботится о большом количестве различий в браузере, так чтобы написать то, что вы обычно писали бы с простой командой в JQuery, мог бы потребовать вполне немного большего количества кода в простом JavaScript.

Имея это в виду, я думаю, что это замечательно, что вы хотите отнять от груди себя от зависимости от jQuery и узнать больше об уроженце методов JavaScript.

Взгляд на код позади jQuery мог бы помочь начать вас. Иначе, почему бы не возвратиться к этому месту, когда у вас есть конкретный вопрос. Я уверен, что люди здесь могли сказать вам о .detach() , .insertAfter() , .on() , и т.д. но каждый, вероятно, потребует отдельного вопроса и некоторого объяснения о том, что вы пытаетесь сделать сначала.

Надежда это помогает (или воодушевляет, по крайней мере).

0
добавлено
JavaScript Jobs — чат
JavaScript Jobs — чат
8 336 участник(ов)

JavaScript Jobs — чат для поиска работы и людей Правила оформления: https://teletype.in/@telegram-ru/r1WQe5F1m См. также: @mobile_jobs, @devops_jobs, @nodejs_jobs, @react_js, @angular_ru, @js_ru

JavaScript.ru
JavaScript.ru
7 932 участник(ов)

Сообщество сайта JavaScript.ru в Slack.

pro.js
pro.js
4 675 участник(ов)

Про JavaScript и NodeJS Invite: https://t.me/joinchat/Be4rsT5Rsgq30DHutjxXgA Правила: http://telegra.ph/ru-chat-rules-06-19 Вакансии только с ЗП, не чаще раза в неделю.

Верстка сайтов HTML/CSS/JS/PHP
Верстка сайтов HTML/CSS/JS/PHP
3 439 участник(ов)

Правила группы: напишите !rules в чате. Группа Вк: vk.com/web_structure Freelancer: @web_fl Веб Дизайн: @dev_design Маркетолог: @topmarkening Автор: @M_Boroda

JavaScript — русскоговорящее сообщество
JavaScript — русскоговорящее сообщество
3 269 участник(ов)

Рекомендуем сразу отключить уведомления Правила: https://rudevs.network/ByaMH6un7 См. также: @js_noobs_ru, @nodejs_ru, @typescript_ru, @react_js, @electron_ru Вакансии и поиск работы: @javascript_jobs

JavaScript Noobs — сообщество новичков
JavaScript Noobs — сообщество новичков
2 484 участник(ов)

Чат для новичков

javascript_ru
javascript_ru
915 участник(ов)

Сообщество любителей самого популярного языка программирования в мире. Чат основан в 2009 году. Логи: https://goo.gl/9EOeM7 Поддержка бота: @chat_linker (ссылка на репу внутри) Вам будут интересны @frontend_ru и @css_ru

jsChat
jsChat
603 участник(ов)

Чат посвященный программированию на языке javaScript Перед отправкой ссылки на Ваш контент посоветуйтесь с админом Все ссылки удаляются ботом автоматически

JavaScript for Zombies Chat
JavaScript for Zombies Chat
492 участник(ов)

Чат про JavaScript для настоящих zombie! Вход строго по приглашениям! Ссылка для строгих приглашений: https://t.me/joinchat/AAMBHz3Uyr0tuZ7VaB029g

All That JS
All That JS
417 участник(ов)

JS на русском