JS diferencia en el atributo y la propiedad.

Tomado del producto es ligeramente Biblioteca  http://www.pinlue.com/article/2020/04/0210/4610102590257.html

propiedad y atributo es muy fácil confundir las dos palabras en chino también son muy similares (propiedad: propiedad, un atributo: características), pero de hecho, los dos son cosas diferentes, pertenecen a diferentes categorías.

la propiedad es el atributo DOM es un objeto en JavaScript;

atributo es una característica de las etiquetas HTML, que sólo puede ser un valor de cadena;

atributo y la propiedad de presentación

Sencillo de entender, nodo de atributo es el propietario de Dom atributos como id html comúnmente usado, la clase, título, alinear similares.

Y este es el elemento de la propiedad DOM como un objeto, su contenido adicional, por ejemplo childNodes, firstChild similares.

Tenemos el siguiente código:

<Div id = clase "div1" = "divClass" title = "divTitle" título1 = "divTitle1"> </ div> var in1 = document.getElementById ( "div1"); console.log (in1);

Para el ID div1 el div, su sección de propiedad dice lo siguiente :()

Puede ser encontrado a tener un "atributos" propiedad con nombre, escriba NamedNodeMap, mientras que los atributos básicos "ID" y "className", "título" y así sucesivamente, pero no hay "títulos" Este atributos personalizados.

console.log (in1.id); //div1console.log(in1.className); //divClassconsole.log(in1.title); //divTitleconsole.log(in1.title1); // indefinido

Se pueden encontrar, atributos de etiqueta, "ID" y "className", "título" se crearán en la in1, y no se crearán "títulos". Esto se debe a que todos los objetos DOM tendrá su propiedad predeterminada de base, y cuando se crea, sólo se va a crear estas propiedades básicas, nuestra etiqueta personalizada en la propiedad TAG no es directamente en el DOM.

¿Dónde está la costumbre de ir "título1"? En los atributos de la propiedad donde se puede ver lo siguiente:

"Título 1" estaba en los atributos del objeto, el objeto se registra secuencialmente número de propiedades y atributos que hemos definido en el TAG.

Se puede ver de aquí, que atribuye la pertenencia a un subconjunto de la propiedad, que contiene la definición de los atributos de las etiquetas HTML. Si exploramos aún más las actitudes de cada propiedad, se dará cuenta de que no son objetos simples, es un objeto de tipo Atr, con NodeType, NombreNodo y otros atributos. En este sentido, otro estudio posterior. Tenga en cuenta que el valor del atributo atributos de impresión del objeto no será directo, pero la obtención de una cadena que contiene el nombre y el atributo de valor, tales como:

console.log (in1.attibutes.title1); // divTitle1

De esto se deduce:

etiquetas HTML y valores de atributo se definen en las propiedades del objeto DOM atributos almacenados en el interior;

las propiedades de JavaScript de estos tipos de atributos se seleccionan Atr, y no sólo para guardar nombres y valores de las propiedades tan simple;

Luego de la siguiente manera:

<Id de entrada = "in_2">

En la siguiente parte de su propiedad:

 

 

Aunque no hemos definido el "valor" en la etiqueta, sino porque es el atributo DOM base por defecto, todavía se creará cuando la inicialización del DOM.

"Pie en ambos campos."

Comúnmente atributo, por ejemplo, id, class, título, etc., se ha añadido a la propiedad como un objeto DOM, y como valores de propiedad y asignación. Sin embargo, desde la definición de atributos, no habría ningún tipo de privilegios especiales, tales como:

<Div id = clase "div1" = "divClass" title = "divTitle" título1 = "divTitle1"> 100 </ div>

Esta div dentro "título1" no se convertirá en una propiedad.

Es decir, siempre que las propiedades (html de) la etiqueta que aparece en el DOM son Atributo. A continuación, algunas características comunes (id, clase, título, etc.), se convierten en propiedad. En sentido figurado, se puede decir que estas características / atributos, un "pie en ambos campos, el".

 

 

Una nota final: el llamado "className" después de "clase" se convierte en la propiedad, como "clase" es las palabras clave ECMA.

DOM tiene sus propiedades básicas predeterminadas, y estas propiedades se conoce como la "propiedad", en cualquier caso, van a volver a crear los objetos DOM durante la inicialización.

Si asigna valores a estas propiedades en la etiqueta, y luego estos valores se les asigna el mismo nombre que el valor inicial de la propiedad DOM.

atributos y valores de propiedad y la asignación

1, los valores de atributo

Se menciona "Js programación avanzada", para mayor comodidad, se recomienda que utilice setAttribute () y getAttribute () pueden ser operados.

<Div id = clase "div1" = "divClass" title = "divTitle" align = "izquierda" título1 = "divTitle1"> </ div> var id = div1.getAttribute ( "id"); var className1 = div1.getAttribute ( "clase"); título var = div1.getAttribute ( "título"); var título1 = div1.getAttribute ( "título1"); // 自 定义 特性

getAttribute () puede conseguir cualquier característica, ya sea estándar o personalizados.

Pero este método de problemas de compatibilidad del navegador, algunos navegadores puede obtener el valor de la propiedad propiedad, por lo jQuery para hacer una prueba para ver getAttribute () si el valor absoluto de las propiedades adquiridas Atributo.

div1.className = 'a'; juez var = div1.getAttribute ( "className") === 'a';

Si se estableció el código anterior, lo que indica que el método getAttribute () no es un problema, ya no se utiliza.

2, asignación de atributo

div1.setAttribute ( 'clase', 'a'); div1.setAttribute ( 'titulo', 'b'); div1.setAttribute ( 'título1', 'c'); div1.setAttribute ( 'title2', 'd');

() Asignación con setAttrbute, cualquier atributo puede incluir personalizado. Por otra parte, la asignación de la Attribute mostrará inmediatamente sobre el elemento de DOM.

Si se trata de una característica estándar también se actualiza el valor de sus atributos asociados:

Por último, nota, setAttribute () son dos parámetros, deben ser cadenas. Esa cadena de función de asignación de propiedades de atributo, mientras que la propiedad de la propiedad puede ser cualquier tipo de tarea.

3, los valores de propiedad

Valor de la propiedad es muy simple. Tome cualquier propiedad única, puede utilizar "".:

var id = div1.id; var className = div1.className; childNodes var = div1.childNodes; attrs var = div1.attributes;

Aquí volvió a insistir:

Cuando las propiedades de clase en característica, el nombre modificado "className", y por lo tanto div1.className div1.getAttrbute ( 'clase') de la misma.

Div1.attributes anteriores código se recurra a esta atributos de propiedad, sacado de una variable guardada a attrs, attrs se convirtieron en un NamedNodeList tipo de objeto, que almacena una pluralidad de tipos Attr.

4. Asignación de la propiedad

Misiones y js básicos objeto asignación de propiedad como se puede utilizar "".:

div1.className = 'a'; = div1.align 'central'; div1.AAAAA = true; div1.BBBBB = [1, 2, 3];

valores de las propiedades se pueden asignar a cualquier tipo de propiedad, y las características del atributo sólo se pueden asignar una cadena!

Además, para la propiedad propiedad valorada en IE puede causar una circular pérdidas de memoria como referencia. Para evitar este problema, jQuery.data () para hacer una oferta especial, el desacoplamiento de datos y objetos DOM.

Cambiar la propiedad de uno y el valor del atributo ¿Qué pasará

in1.value = 'nuevo valor de prop'; console.log (in1.value); // 'nuevo valor de prop'console.log (in1.attributes.value); // 'value = "1"'

En este caso, el valor de los campos de entrada en la página en un "nuevo valor del puntal", y Propety en el valor se ha convertido en un valor nuevo, pero atribuye todavía es "1" De aquí se puede deducir el valor de la propiedad y la propiedad del mismo atributo de nombre no es una unión de dos vías.

Si, a su vez, establecer el valor de actitudes, el efecto pasaría entonces?

in2.setAttribute ( 'valor', 'ni') console.log (in2.value); //niconsole.log(in2.attributes.value); // value = 'ni'

Por lo tanto, se puede concluir:

propiedad que se sincroniza a partir del atributo;

El valor del atributo de propiedad no se sincronizará;

Los datos de atributos y la propiedad de unión entre el atributo,> propiedad unidireccional,;

Cambiar cualquier valor de la propiedad y atributo, se actualizará para reflejar la página HTML;

 

Publicado 60 artículos originales · ganado elogios 58 · Vistas de 140.000 +

Supongo que te gusta

Origin blog.csdn.net/yihuliunian/article/details/105340851
Recomendado
Clasificación