Cómo agregar atributo al elemento DOM en JavaScript
El DOM es la estructura de un documento HTML que comienza desde su elemento raíz hasta el final del documento. Cualquier elemento, como "pag","div", o "mesa", Se conoce como el elemento DOM. Los elementos DOM permiten al usuario modificar el contenido de la página web. Un atributo especifica la colección de objetos. Además, JavaScript proporciona métodos setattribute () para agregar o modificar los atributos de los elementos DOM. En esta publicación, hemos demostrado todos los métodos posibles para agregar atributos a los elementos DOM en JavaScript.
- Cómo agregar atributo al elemento DOM en JavaScript
- Agregar atributo al elemento DOM
- Agregue múltiples atributos al elemento DOM
Cómo agregar atributo al elemento DOM en JavaScript?
El método setattribute () se emplea para agregar un valor de atributo a un elemento existente. Si el atributo ya está agregado, setAttribute () actualiza el valor. Toma dos entradas, una es el nombre y el segundo especifica el valor. Al cargar la página web, la propiedad de atributo se aplica a los elementos DOM. La sintaxis del método setattribute () se proporciona a continuación:
Sintaxis
setAttribute (nombre, valor)
Los parámetros se describen de la siguiente manera:
- nombre: Se refiere al nombre del atributo.
- valor: Especifica el valor del atributo.
Ejemplo 1: Agregue un atributo al elemento DOM
Se considera un ejemplo mediante la adición de un atributo al elemento DOM. El método setattribute () se utiliza para agregar valor al atributo. El código de ejemplo se escribe a continuación:
Código
Ejemplo para agregar atributo al elemento DOM.
Haga clic en el botón para deshabilitarlo
La descripción del código se proporciona a continuación:
- Un botón llamado "Haga clic en el botón"Está adjunto y tiene una identificación única"btn".
- Después de eso, este botón está asociado con el "btn_fn ()" método.
- En este método, "GetElementByid"Se utiliza para extraer el"btn" identificación.
- Finalmente, el "setAttribute ()El método se emplea para deshabilitar el botón pasando un vacío Desactiva el botón presionándolo.
Producción
Se observa que después de presionar el "Haga clic en el botón", El valor discapacitado es aprobado por el"setAttribute ()" método.
Ejemplo 2: Agregue múltiples atributos al elemento DOM
Se considera un ejemplo para agregar múltiples atributos al elemento DOM utilizando el método setattribute () en JavaScript. El método setattribute () extrae los elementos DOM por GetElementByid. Después de eso, asigne la propiedad a través del método setattribute (). Estos atributos incluyen un botón, enlace y propiedad de estilo. Por ejemplo, el código es el siguiente.
Código
Ejemplo de agregar un atributo usando el método setattribute ().
Google.comunicarse
La descripción del código se proporciona en el siguiente pedido:
- En primer lugar, un ancla ""La etiqueta se emplea pasando la identificación"enlace".
- En este enlace, "comunicarse"Se pasa como texto para mostrar en el navegador.
- Un botón "Agregar atributo"Está unido que está asociado con el"divertido()" método. El "func ()"Será activado por el botón con el al hacer clic valor.
- El "setAttribute ()"El método se utiliza para buscar"enlace" usando "GetElementByid" y un "href"El atributo está establecido cuyo valor es"https: // www.Google.com/".
- Del mismo modo, un "estilo"El atributo está establecido cuyo valor es "Color de fondo: rojo" Para cambiar el color de fondo de texto.
Producción
En primer lugar, el texto no se puede hacer clic en. Después de presionar el botón "Agregar atributo", Se agrega un enlace al texto"Google.comunicarse"Que se puede hacer clic ahora y abre la página web asociada con el enlace.
Conclusión
El método setAttribute () se emplea para agregar un atributo a los elementos en JavaScript. El mismo método actualiza el valor del atributo si el elemento DOM ya contiene el atributo. Esta publicación ha demostrado los métodos para agregar atributos a los elementos DOM en JavaScript. El método setattribtue () toma un nombre y un valor como argumentos. Además, los usuarios pueden establecer múltiples atributos a los elementos DOM utilizando JavaScript. Este artículo demuestra dos ejemplos agregando y modificando el valor de atributo del elemento DOM en JavaScript.