Programing

jquery 코드를 자바 스크립트로 변환하는 쉬운 방법이 있습니까?

crosscheck 2020. 6. 30. 20:41
반응형

jquery 코드를 자바 스크립트로 변환하는 쉬운 방법이 있습니까? [닫은]


jQuery를 사용하여 javascript / dom에서 특정 작업을 수행하는 많은 예제가 있습니다. 그러나 jQuery를 사용하는 것이 항상 jQuery로 작성된 자바 스크립트 솔루션의 예를 이해하는 데 도움이되는 옵션은 아닙니다.

jQuery 코드를 일반 자바 스크립트로 변환하는 쉬운 방법이 있습니까? jQuery 소스 코드에 액세스하거나 이해하지 않아도 될 것 같습니다.


가장 쉬운 방법은 일반 DOM API를 사용하여 DOM 순회 및 조작을 수행하는 방법을 배우는 것입니다 (일반 JavaScript라고 함).

그러나 이것은 어떤 것들에게는 고통이 될 수 있습니다. (이것이 라이브러리가 처음에 발명 된 이유입니다).

"javascript DOM traversing / manipulation"에 대한 인터넷 검색은 많은 도움이되는 (그리고 덜 도움이되는) 리소스를 제공해야합니다.

이 웹 사이트의 기사는 꽤 좋습니다 : http://www.htmlgoodies.com/primers/jsp/

그리고 Nosredna가 의견에서 지적한 것처럼 : jQuery는 불일치를 처리하지 않기 때문에 모든 브라우저에서 테스트해야합니다.


이것은 당신에게 방법의 90 %를 얻을 것이다; )

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

Ajax의 경우 Fetch API모든 주요 브라우저의 현재 버전에서 지원됩니다 . 를 들어 $.ready(), DOMContentLoaded근처 보편적 인 지원을 . 필요없는 jQuery 는 다른 일반적인 jQuery 함수에 동등한 기본 메소드를 제공합니다.

Zepto 는 유사한 기능을 제공하지만 10K 압축시 무게가 나갑니다 . jQuery 및 Zepto에 대한 사용자 정의 Ajax 빌드와 일부 마이크로 프레임 워크 가 있지만 jQuery / Zepto는 견고한 지원을 제공하며 56KB 모뎀에서 10KB는 ~ 1 초에 불과합니다.


방금 2012 년 1 월 19 일 Jeffrey Way 에서 jquery를 자바 스크립트로 변환하는 것에 대한 인상적인 튜토리얼을 찾았습니다 *Copyright © 2014 Envato*.

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…
  });
});

한번 봐봐


나는 이것이 오래된 스레드라는 것을 알고 있지만 jquery와 동등한 네이티브 자바 스크립트를 보여주는 훌륭한 리소스가 있으며 ES6 예제도 포함합니다. 이것은이 주제를 다루는 다른 기사에서 찾은 가장 포괄적 인 것입니다.

jQuery에서 Vanilla JS로


jQuery 코드를 일반 자바 스크립트로 변환하는 쉬운 방법이 있습니까?

아니요, 특히 다음과 같은 경우 :

jQuery로 작성된 자바 스크립트 솔루션의 예를 이해하는 것은 어렵다.

JQuery와 모든 프레임 워크는 코드를 이해하기 쉽게 만드는 경향이 있습니다. 그것이 이해하기 어려운 경우, 바닐라 자바 ​​스크립트는 고문 될 것입니다 :)


자바 스크립트를 배우려면 Douglas Crockford 비디오를보십시오. 걔네들은 엄청 좋아요.

  1. 자바 스크립트 프로그래밍 언어 : 역사, 언어, 고급 기능, 플랫폼, 표준, 스타일 [ 다운로드 슬라이드 ]
  2. DOM 이론 [ 다운로드 슬라이드 ]
  3. 고급 자바 스크립트 : 상속, 모듈, 디버깅, 효율성, JSON [ 슬라이드 다운로드 ]

jQuery 코드를 표준 JavaScript로 자동 컴파일하는 이유는 원래 게시물과 관련이 없습니다.

16k 또는 gzip으로 축소 된 jQuery 라이브러리가 무엇이든 모바일 브라우저 용 웹 사이트에는 너무 많을 수 있습니다. w3c는 모바일 웹 사이트에 대한 모든 HTTP 요청이 최대 20k가되도록 권장합니다.

모바일 용 w3c 사양

So I enjoy coding in my nice, terse, chained jQuery. But now I need to optimize for mobile. Should I really go back and do the difficult, tedious work of rewriting all the helper functions I used in the jQuery library? Or is there some kind of convenient app that will help me recompile?

That would be very sweet. Sadly, I don't think such a thing exists.


Jeremy Keith's book "DOM Scripting" is a great intro to working with Javascript and the DOM. I highly recommend it, whether you want to use jQuery or not. It's good to know what's going on beneath.


There are several good books available. I like ppk on JavaScript. Here's Chapter 8 on the DOM.

참고URL : https://stackoverflow.com/questions/978799/is-there-an-easy-way-to-convert-jquery-code-to-javascript

반응형