2011-05-05 8 views
8

Si quitaProp en algo que debería haber usado removeAttr on, ¿fallará silenciosamente? ¿Funcionará? ¿Realmente eliminará todo el atributo o solo el valor dentro de él?¿Cuál es la diferencia entre removeProp y removeAttr en JQuery 1.6?

Si 'checked' se agrega usando prop(), ¿se puede eliminar con removeAttr?

¡Muchas preguntas!

+3

¿No son el tipo de preguntas que se pueden responder a sí mismo escribiendo 5-10 líneas de jQuery y observando los resultados? –

Respuesta

4

Un atributo de un elemento es algo así como 'clase'. Mientras que su propiedad sería 'className'.

Este es el motivo para agregar jQuery.prop y jQuery.propHooks a la versión 1.6, para que sea más fácil trabajar con ambos.

Por lo tanto, si la propiedad tiene el mismo nombre que el atributo, puede usar tanto removeProp como removeAttr.

me hizo una pregunta similar en el foro jQuery, tiene esta respuesta:

Sí, attr es para atributos HTML ya que están estrictamente definidas. prop es para las propiedades. Entonces, por ejemplo, digamos tiene un nodo elem con clase "algo" (elemento en bruto no jQuery objeto). elem.className es la propiedad , pero es donde reside el atributo . Cambiar el atributo de clase también cambia automáticamente la propiedad y viceversa. Actualmente, attr está mezclado y confuso porque ha intentado con el trabajo de ambas funciones y hay muchos errores debido a eso. La introducción de jQuery.fn.prop se resolver varios bloqueadores, código separado como debería haber sido separado de el principio, y dar a los desarrolladores funciones más rápidas para hacer lo que espera que hagan. Permítanme hacer un porcentaje de por un segundo y decir que desde mi experiencia en el IRC de soporte y leyendo el código de otro, el 95% de las cajas de uso para attr no tendrán que cambiar para prop.

EDITAR

Puede ser el mejor pegarse a la utilización de cualquiera jQuery.attr o jQuery.prop. Parece que hay un comportamiento extraño al establecer y eliminar el atributo comprobado con ambos.

Vea aquí un ejemplo: http://jsfiddle.net/tomgrohl/uTCJF/

Hay un error en la versión 1.6 que ver con seleccionaron: http://bugs.jquery.com/ticket/9079

7

El official jQuery blog proporciona una explicación muy clara:

En la nota de 1,6 que he dividido el manejo de los atributos DOM y las propiedades DOM en métodos separados. El nuevo método .prop() establece u obtiene propiedades en elementos DOM, y .removeProp() elimina propiedades.En el pasado, jQuery no ha dibujado una línea clara entre las propiedades y los atributos . Generalmente, los atributos DOM representan el estado de la información de DOM tal como se obtuvo del documento, como como el atributo de valor en el marcado . Las propiedades DOM representan el estado dinámico del documento; por ejemplo, si el usuario hace clic en el elemento de entrada encima de y escribe def .prop("value") es abcdef pero el .attr("value") sigue siendo abc.

En la mayoría de los casos, el navegador trata el valor atributo como el valor de partida de la propiedad, pero Boole atributos tales como equipaje facturado o discapacitados tienen semántica inusuales.

Por ejemplo, considere el marcado <input type="checkbox" checked>. La presencia del atributo comprobado significa que la propiedad DOM .checked es verdadera, aunque el atributo no tenga un valor. En el código anterior, el valor del atributo comprobado es una cadena vacía (o undefined si no se especificó el atributo ) pero el valor de propiedad verificado es true.

Antes de jQuery 1.6, .attr("checked") devolvió el valor de propiedad Boolean (true) pero a partir de jQuery 1.6 que devuelve el valor real del atributo (una cadena vacía ), que no cambia cuando el usuario hace clic la casilla de verificación cambia su estado.

Hay varias alternativas para que comprueban el estado actualmente-comprobado de una casilla de verificación. Lo mejor y más es utilizar la propiedad DOM directamente, como en this.checked dentro de un controlador de eventos cuando este hace referencia al elemento que se hizo clic. En el código que utiliza jQuery 1.6 o posterior, el nuevo método $(this).prop("checked") recupera el mismo valor que this.checked y es relativamente rápido. Finalmente, la expresión $(this).is(":checked") funciona para todas las versiones de jQuery.

+0

Jeje, estaba leyendo eso. Eso explica el extraño comportamiento aquí: http: // jsfiddle.net/tomgrohl/uTCJF / – Tomgrohl

0

Usando jQuery 1.6, me estaba tratando de clonar un elemento de menú que tenía varias id atributos, y así lo hice:

$('ul.menu').clone().filter('*').removeProp('id').appendTo('.sidebar');

Cuando inspeccioné los elementos de Firebug que tenía una lote de id="undefined" - no es lo que quería. Así que ahora estoy usando removeAttr y parece funcionar mucho mejor.

$('ul.menu').clone().filter('*').removeAttr('id').appendTo('.sidebar');

Cuestiones relacionadas