Czy istnieje prosty sposób na przekonwertowanie kodu jQuery na javascript? [Zamknięte]

142

Czy istnieje prosty sposób na przekonwertowanie kodu jQuery na zwykły javascript? Chyba bez dostępu do kodu źródłowego jQuery lub zrozumienia go.

davidsleeps
źródło
8
Zasadniczo
szukałem
1
Nawet jeśli nie możesz użyć tagu skryptu, aby dołączyć jQuery, zawsze możesz dołączyć minified verison do pliku źródłowego. Nie widzę żadnego powodu, dla którego jQuery nie byłby dostępny poza jakimś rodzajem polityki korporacyjnej.
cdmckay
23
Widzę, że to również dobre zastosowanie. Suppoe używasz tylko około 10-100 linii w javascript z jQuery. Pozwoliłoby to zaoszczędzić przepustowość, rekompilując i zastępując funkcje metodami podstawowymi, a tym samym nie ładując wszystkiego innego z jQuery.
5
Mam to samo pytanie. Wielu odpowiedziało, że jQuery jest prostsze, ale programista, który zna już JavaScript, będzie miał problem ze zrozumieniem symbolu / skrótu w jQuery. Moim powodem do pytania jest to, że z jakiegoś powodu skrypt jQuery, który otrzymałem, nie będzie działał na Blackberry. To skrypt wysyłający Ajax. Więc myślę, że muszę przetłumaczyć to na Javascript :(
1
Próbuję zrobić JS-kludge wewnątrz istniejącej aplikacji, a wszystkie wbudowane funkcje JS aplikacji zepsują się, jeśli dołączę jQuery. To słabo napisana aplikacja (JIRA Atlassian) i jestem pewien, że jest to wina, ale ja potrzebuję tego samego.
chadoh

Odpowiedzi:

41

Najłatwiej jest po prostu nauczyć się przechodzić przez DOM i manipulować nim za pomocą zwykłego interfejsu API DOM (prawdopodobnie nazwałbyś to: normalnym JavaScriptem).

Może to jednak być uciążliwe dla niektórych rzeczy. (dlatego w pierwszej kolejności wymyślono biblioteki).

Wyszukiwanie w Google hasła „przechodzenie / manipulowanie językiem DOM w javascript” powinno zawierać wiele przydatnych (i mniej pomocnych) zasobów.

Artykuły na tej stronie są całkiem dobre: http://www.htmlgoodies.com/primers/jsp/

I jak Nosredna zwraca uwagę w komentarzach: koniecznie przetestuj we wszystkich przeglądarkach, ponieważ teraz jQuery nie będzie obsługiwał za Ciebie niespójności.

Pim Jager
źródło
4
I musisz upewnić się, że przetestowałeś różne wersje każdej przeglądarki.
Nosredna
1
Jak wybór stacjonarnej stacji roboczej wpływa na wykorzystanie jQuery?
Dan Davies Brackett
5
Współczuję polityce korzystania z biblioteki open source dla niektórych organizacji. W końcu czas, który spędzasz na prostym przepisywaniu (i prawdopodobnie błędnym) do zwykłego przechodzenia przez DOM, a JS jest marnowaniem pieniędzy dla firmy. Można by argumentować, że duże firmy, w tym bardzo konserwatywne, używają jQuery: docs.jquery.com/Sites_Using_jQuery : Oracle, Google, Amazon, Dell, Bank of America, Intuit, Salesforce. To nie są hipisowskie, komunistyczne firmy. Są to bardzo prawdziwe firmy, których działy prawne prawdopodobnie
odrobiły
2
@davidsleeps - jQuery jest usankcjonowane przez Microsoft ... Jest zawarte w Visual Studio 2008, co technicznie czyni z niego narzędzie "Microsoft". Czy to poprawiłoby samopoczucie pracodawcy?
Robert Harvey
4
Jaka jest różnica w Twojej firmie między jquery a całą masą javascript, które napisałeś, aby zrobić to samo? To nie tak, że coś instalujesz, kodujesz w nowym języku lub dodajesz JAKIEKOLWIEK zależności. To najgłupsza rzecz, jaką słyszałem, zezwalając na obsługę javascript, ale nie jQuery. jQuery JEST JAVASCRIPT!
micmcg
60

To zapewni ci 90% drogi tam; )

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

W przypadku Ajax interfejs Fetch API jest teraz obsługiwany w bieżącej wersji wszystkich głównych przeglądarek . Dla $.ready(), DOMContentLoadedma powszechnego poparcia pobliżu . Możesz nie potrzebować jQuery zapewnia równoważne metody natywne dla innych popularnych funkcji jQuery.

Zepto oferuje podobną funkcjonalność, ale waży 10K z zamkiem błyskawicznym . Istnieją niestandardowe kompilacje Ajax dla jQuery i Zepto, a także niektóre mikro-frameworki , ale jQuery / Zepto ma solidną obsługę, a 10KB to tylko ~ 1 sekunda na modemie 56K.

Indoling
źródło
22

Właśnie znalazłem ten dość imponujący tutorial o konwersji jquery do javascript z Jeffrey Way 19 stycznia 2012 *Copyright © 2014 Envato* :

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

Czy nam się to podoba, czy nie, coraz więcej programistów jest wprowadzanych do świata JavaScript za pośrednictwem jQuery. Pod wieloma względami ci nowicjusze są szczęśliwcami. Mają dostęp do mnóstwa nowych API JavaScript, które znacznie ułatwiają proces przechodzenia przez DOM (coś, od czego wielu ludzi polega na jQuery). Niestety nie wiedzą o tych interfejsach API!

W tym artykule zajmiemy się różnymi typowymi zadaniami jQuery i przekonwertujemy je zarówno na nowoczesny, jak i starszy JavaScript.

Zaproponowałem to w komentarzu do OP i po jego sugestii publikuję, że ma odpowiedź, do której każdy może się odwołać.

Ponadto Jeffrey Way wspomniał o swojej inspiracji czarownicą, która wydaje się być dobrym podkładem do zrozumienia: http://sharedfil.es/js-48hIfQE4XK.html

Ma zwiastun, to porównanie dokumentu jQuery do 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…
  });
});

Powinieneś spojrzeć.

Milche Patern
źródło
12

Wiem, że to stary wątek, ale istnieje doskonały zasób pokazujący natywny odpowiednik jquery w javascript, który zawiera nawet przykłady z ES6. Jest to najbardziej obszerny artykuł, jaki znalazłem w innych artykułach na ten temat.

jQuery do Vanilla JS

dan
źródło
6

Czy istnieje prosty sposób na przekonwertowanie kodu jQuery na zwykły javascript?

Nie, zwłaszcza jeśli:

zrozumienie przykładów rozwiązań javascript napisanych w jQuery [jest] trudne.

JQuery i wszystkie frameworki zwykle ułatwiają zrozumienie kodu. Jeśli trudno to zrozumieć, to javascript waniliowy będzie torturą :)

Ryan Florence
źródło
15
inni mają aktualne odpowiedzi
ftrotter
2
Ponadto, chociaż sprawia JQuery kod bardziej zwięzłe (zazwyczaj), to dyskusyjna, czy to rzeczywiście sprawia, że łatwiej . jQuery może utrudnić psychiczne przeanalizowanie kodu. Na przykład <input onclick="myfunction(this)">z myfunction(field){ field.value = "3"; }ma dla mnie więcej sensu niż <input id='thing'>z(function ($) { $(thing).click({ $(thing).val("3");});})()
liljoshu
6

Widzę powód, niezwiązany z oryginalnym postem, aby automatycznie skompilować kod jQuery do standardowego JavaScript:

16k - lub jakakolwiek jest spakowana gzipem, zminimalizowana biblioteka jQuery - może być zbyt duża dla Twojej witryny internetowej przeznaczonej dla przeglądarki mobilnej. W3c zaleca, aby wszystkie żądania HTTP dla witryn mobilnych miały maksymalnie 20 tys.

specyfikacje w3c dla telefonów komórkowych

Więc lubię kodować w moim ładnym, zwięzłym, łańcuchowym jQuery. Ale teraz muszę zoptymalizować pod kątem urządzeń mobilnych. Czy naprawdę powinienem wrócić i wykonać trudną, żmudną pracę polegającą na przepisaniu wszystkich funkcji pomocniczych, których używałem w bibliotece jQuery? A może jest jakaś wygodna aplikacja, która pomoże mi ponownie skompilować?

To byłoby bardzo słodkie. Niestety, nie sądzę, aby coś takiego istniało.


źródło
6

Jeśli chcesz nauczyć się javascript, obejrzyj te filmy Douglasa Crockforda. Oni są bardzo dobrzy.

  1. Język programowania Javascript: historia, język, funkcje zaawansowane, platformy, standardy, styl [ pobierz slajdy ]
  2. Teoria DOM [ pobierz slajdy ]
  3. Zaawansowany JavaScript: dziedziczenie, moduły, debugowanie, wydajność, JSON [ pobierz slajdy ]
bobobobo
źródło
2
Trochę poza tematem, ale przemówienia Crockforda są ogólnie niesamowite.
Indolering
1

Książka Jeremy'ego Keitha „ DOM Scripting ” to świetne wprowadzenie do pracy z Javascriptem i DOM. Bardzo go polecam, niezależnie od tego, czy chcesz korzystać z jQuery, czy nie. Dobrze jest wiedzieć, co się dzieje pod spodem.

dylanfm
źródło