¿Cuál es tu característica favorita de jQuery?

Question

Acabo de recibir la epifanía de jQuery el otro día y todavía siento que hay toneladas de energía en ella que no estoy utilizando.

Dicho eso, ¿cuál es su característica favorita de jQuery que le ahorra tiempo y/o hace que sus aplicaciones del lado del cliente sean mucho más geniales o potentes?

Answer 1

Mi característica favorita de jQuery es cómo ayudó a convertir JavaScript de un lenguaje odiado a un lenguaje sexy casi de la noche a la mañana.

Answer 2

Selectors, y encadenar.

Answer 3

Encadenamiento! Las enormes cadenas de jQuery son increíbles. A veces no puedo parar. Se siente casi como hacer todo en una línea (no quiero negarlo).

this.lasso = $('<div/>') 
    .css({ position: 'absolute', overflow: 'hidden' }) 
    .addClass('ui-crop-lasso') 
    .hide() 
    .appendTo('body') 
    .resizable({ 
     handles: 'all', 
     start: setLasso, 
     stop: setLasso, 
     resize: setLasso, 
     minHeight: 50, 
     minWidth: 50 
    }) 
    .draggable({ 
     containment: el, 
     cursorAt: 'move', 
     drag: setLasso 
    }); 

Pruébalo, serás adicto enseguida.

Answer 4

La forma en que los objetos jQuery funcionan independientemente de que sean ninguno, uno o muchos elementos DOM en él.

Además, manejo de eventos de rocas. Ser capaz de devolver resultados falsos al hacer clic, por ejemplo, rocas.

Answer 5

El sistema de complementos es increíble. Técnicamente podría ser, y seguir siendo, un novato JQuery completo y aún así explotar la mayoría, si no todo, su poder mediante la aplicación de complementos. Esto lo hace muy popular entre artistas y no programadores que solo buscan agregar información sobre herramientas, diálogo modal, lightbox, menú desplegable, etc.

Answer 6

No es exactamente una característica, sino la cantidad de complementos ya escritos y la información de la comunidad cómo usar jQuery es definitivamente una ventaja. De lo contrario, selectores junto con el sistema de plug-in.

Answer 7

Como recién llegado a jQuery, tiene que ser el complemento jQuery UI, y los temas que la gente ha diseñado para ir con él. ThemeRoller le permite adaptar rápidamente temas y reproducir escenarios de "qué pasaría si" con su aplicación, ya que se muestra en Firefox. Pude mejorar enormemente una aplicación web mediante el uso de pestañas, controles deslizantes de acordeón, selectores de fecha y alertas en solo uno o dos días a partir de ningún conocimiento de jQuery.

A los desarrolladores web más experimentados les gustará la filosofía de jQuery de "JavaScript no intrusivo", su riguroso aprovechamiento de XHTML y CSS, selectores y encadenamiento.

Answer 8

Creación de un elemento HTML y mantener una referencia:

var newDiv = $('<div></div>'); 
newDiv.attr("id","myNewDiv").appendTo("body"); 
//Now whenever I want to append the new div I created, 
//I can just reference it from the 'newDiv' variable 

Comprobación de si existe un elemento:

if ($("#someDiv").length) { 
    //it exists... 
} 

Escribir sus propios selectores:

$.extend($.expr[':'], { 
    over100pixels: function(a) { 
     return $(a).height() > 100; 
    } 
}); 

$('.box:over100pixels').click(function() { 
    alert('The element you clicked is over 100 pixels high'); 
}); 

Answer 9

No tener que preocuparse (tanto) sobre la compatibilidad entre diferentes navegadores

Answer 10

Me gusta el hecho de que trata a principiantes y expertos por igual, hasta cierto punto. Sin embargo, si sabes lo que estás haciendo, realmente puedes hacer que una aplicación brille en todos los aspectos.Cosas como la carga diferida, la separación de código y la creación de plantillas se pueden lograr con jQuery. Fue diseñado como una herramienta DOM, pero puede ser fácilmente adaptado para ser espaciado de nombres y para actuar como un framework js full-stack.

En pocas palabras, creo que la mejor característica de jQuery es que se diseñó desde todos los ángulos con la idea de la simplicidad en mente. La respuesta más simple suele ser la mejor respuesta.

Answer 11

Principalmente cosas que requieren muchas pruebas y ajustes entre navegadores que posiblemente no podría escribirme como confiable y probar tan extensamente como lo hace la comunidad jQuery. Esto incluye:

• $ (documento) .ready (...). Mire la implementación de esta función. Hay muchas declaraciones if-else que verifican varias características del navegador.

• Métodos de posición y dimensión: $ (...). Offset(), $ (...). Position(), $ (...). Width(), $ (...). innerWidth() etc. Nuevamente, la misma historia aquí. Además, funcionan de manera confiable (o supongo de manera más confiable que yo podría lograrlo) para casos especiales como ventanas y documentos.

• $ (...). Animate(). La capacidad de animar elementos basados ​​en cualquier estilo CSS (razonable). También encadenamiento de animación y $ (...). Stop(). API muy fluida.

• Controladores de eventos. Esto es algo que tiene cada biblioteca de JavaScript, y no es algo que uno no podría implementar por sí mismo, pero es agradable tenerlo.

También hay algunas características menos favoritas. Uno de ellos es el encadenamiento de funciones, que parece ser el estilo de programación jQuery semioficial. Puede ser impresionante a primera vista, pero en general, no es algo que no se pueda hacer usando variables y declaraciones separadas y, al final, en mi opinión, conduce a un código menos legible.

Otra cosa menor que me gusta menos es el afán de usar cierres y funciones anónimas profundamente anidadas. Puede ser más difícil leer dicho código después de una semana. Puede no ser inmediatamente obvio de dónde vienen algunas variables y qué ámbitos de función son. Intente preparar una fuente jQuery más elaborada para ver a qué me refiero.

A pesar de que uno de los puntos de venta de jQuery son los selectores, me parece que no los necesito con tanta frecuencia, y si necesito alguno, generalmente me salgo con los básicos.

Finalmente, la manipulación de jQuery DOM tiene algunas utilidades útiles, pero en general, creo que se podría lograr lo mismo con un poco más de código (aunque tedioso). Sé que es muy simplista, pero no parece que haya problemas serios entre navegadores.

Answer 12

selectores con soporte para CSS 1-3 y XPath combinado y de sus propios selectores personalizados!

// "odd" numbered rows in a table with class "orders" 
jQuery('table.orders tr:odd') 

// All external links (links that start with http://) 
jQuery('a[@href^="http://"]') 

Answer 13

Me gusta el aspecto de jQuery de eliminar los controladores de eventos de HTML para separar el contenido del comportamiento.En lugar de escribir

<p class="active" onclick="myFunction()">foo</p> 

varias veces en una página web, puedo escribir esto en su lugar:

<p class="active">foo</p> 

y escribir esto una vez dentro de mis etiquetas de script:

$(".active").click(function(){ ... }); 

¿Por qué me gusta ¿esto mejor? Porque jQuery separa el contenido de la funcionalidad de la misma manera que CSS separa el contenido del estilo. Y como Jan Zich y otros mencionan, jQuery hace que gran parte de esa funcionalidad sea muy fácil de programar para cualquier navegador, por lo que la animación se convierte en una brisa cuando se quiere simular pestañas que muestran/esconden divs en una página para el usuario.

Answer 14

expresiones regulares en los selectores (ya que utilizar ASP.Net y los controles tienen ID ridículos, prestados.)

Para conseguir esto en jQuery:

<asp:TextBox ID="txtTest" runat="server" /> 

acabo de hacer esto:

$("input[id$='txtTest']") 

Me ha hecho cambiar mi perspectiva al hacer las cosas del lado del cliente en los sitios web.

Answer 15

Plug-in sistema de:

((function($){ 
    $.fn.plugin = function(){ 
     return this.each(function(){ 
      //code here 
     }); 
    } 
})(jQuery) 

cadena:

$('.parent').children().remove().end().css('background-color', 'red'); 

la compatibilidad entre navegadores a través de variedad de características, por ejemplo. Ajax

$.GET('url', {data: 'here'}, function(data){ /* callback */ }); 

Answer 16

valores relativos en el Funciton animado:

$('div.class:hover').animate({ height: '+=10', width: '+=10', opacity: '-=.5' })