¿Hay una manera fácil de convertir el código jquery a javascript? [cerrado]

Existen muchos ejemplos para lograr ciertas cosas en javascript / dom usando jQuery. Sin embargo, usar jQuery no siempre es una opción que puede dificultar la comprensión de los ejemplos de soluciones javascript escritas en jQuery.

¿Hay una manera fácil de convertir el código jQuery a JavaScript normal? Supongo que sin tener que acceder o comprender el código fuente de jQuery.

La forma más fácil es aprender cómo atravesar y manipular DOM con la API de DOM simple (probablemente llamaría esto: JavaScript normal).

Sin embargo, esto puede ser un dolor para algunas cosas. (razón por la cual las bibliotecas se inventaron en primer lugar).

Buscar en Google "JavaScript DOM traversing / manipulation" debería presentarle muchos recursos útiles (y algunos menos útiles).

Los artículos en este sitio web son bastante buenos: http://www.htmlgoodies.com/primers/jsp/

Y como Nosredna señala en los comentarios: asegúrese de probar en todos los navegadores, porque ahora jQuery no manejará las inconsistencias por usted.

Esto te llevará al 90% del camino; )

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

Para Ajax, la API Fetch ahora es compatible con la versión actual de cada navegador principal . Para $.ready(), DOMContentLoadedtiene un soporte casi universal . Es posible que no necesite jQuery proporciona métodos nativos equivalentes para otras funciones comunes de jQuery.

Zepto ofrece una funcionalidad similar pero pesa 10K con cremallera. Hay compilaciones personalizadas de Ajax para jQuery y Zepto, así como algunos micro frameworks , pero jQuery / Zepto tiene un soporte sólido y 10KB es solo ~ 1 segundo en un módem de 56K.

Acabo de encontrar este tutorial bastante impresionante sobre la conversión de jquery a javascript de Jeffrey Way el 19 de enero de 2012 *Copyright © 2014 Envato* :

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

Nos guste o no, cada vez más desarrolladores están siendo introducidos al mundo de JavaScript a través de jQuery primero. En muchos sentidos, estos recién llegados son los afortunados. Tienen acceso a una gran cantidad de nuevas API de JavaScript, que hacen que el proceso de atravesar DOM (algo de lo que mucha gente depende de jQuery) sea considerablemente más fácil. ¡Desafortunadamente, no saben sobre estas API!

En este artículo, tomaremos una variedad de tareas comunes de jQuery y las convertiremos a JavaScript moderno y heredado.

Lo propuse en un comentario a OP, y después de su sugerencia, publico tiene una respuesta para que todos puedan consultar.

Además, Jeffrey Way mencionó sobre su inspiración, la bruja parece ser un buen manual para comprender: http://sharedfil.es/js-48hIfQE4XK.html

Tiene un avance, esta comparación de documentos de jQuery a 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…
  });
});

Deberías echar un vistazo.

Sé que este es un hilo antiguo, pero hay un excelente recurso que muestra el javascript nativo equivalente a jquery, incluso incluye ejemplos de ES6. Este es el más completo que he encontrado de los otros artículos que cubren este tema.

jQuery to Vanilla JS

¿Hay una manera fácil de convertir el código jQuery a JavaScript normal?

No, especialmente si:

Comprender los ejemplos de soluciones javascript escritas en jQuery [es] difícil.

JQuery y todos los marcos tienden a facilitar la comprensión del código. Si eso es difícil de entender, entonces JavaScript vainilla será una tortura :)

Puedo ver una razón, no relacionada con la publicación original, para compilar automáticamente el código jQuery en JavaScript estándar:

16k, o lo que sea que sea la biblioteca jQuery minimizada y comprimida, puede ser demasiado para su sitio web destinado a un navegador móvil. El w3c recomienda que todas las solicitudes HTTP para sitios web móviles tengan un máximo de 20k.

Especificaciones de w3c para dispositivos móviles

Así que disfruto codificando en mi jQuery bonito, conciso y encadenado. Pero ahora necesito optimizar para dispositivos móviles. ¿Realmente debería regresar y hacer el trabajo difícil y tedioso de reescribir todas las funciones auxiliares que utilicé en la biblioteca jQuery? ¿O hay algún tipo de aplicación conveniente que me ayude a compilar?

Eso sería muy dulce. Lamentablemente, no creo que tal cosa exista.

Si quieres aprender JavaScript, mira estos videos de Douglas Crockford. Ellos son muy buenos.

1. El lenguaje de programación Javascript: Historia, Idioma, Funciones avanzadas, Plataformas, Estándares, Estilo [ diapositivas de descarga ]
   • Ver entrada de blog de YUI
2. Teoría del DOM [ descargar diapositivas ]
   • Ver entrada de blog de YUI
3. Javascript avanzado: herencia, módulos, depuración, eficiencia, JSON [ diapositivas de descarga ]
   • Ver entrada de blog de YUI

El libro de Jeremy Keith " DOM Scripting " es una gran introducción para trabajar con Javascript y DOM. Lo recomiendo, ya sea que quieras usar jQuery o no. Es bueno saber qué está pasando debajo.

Hay varios buenos libros disponibles. Me gusta ppk en JavaScript. Aquí está C hapter 8 en el DOM .