Establecer un nuevo valor para el atributo usando jQuery

Shiv Yadav 21 junio 2022
Establecer un nuevo valor para el atributo usando jQuery

Este artículo demostrará cómo establecer un nuevo valor para el atributo usando jQuery.

Establecer un nuevo valor para el atributo usando jQuery

La operación attr() establece o devuelve los atributos y valores de los componentes que se han elegido. Cuando se usa para reemplazar el valor del atributo, esta función entrega el valor del PRIMER elemento coincidente.

Este método establece uno o más pares de atributo/valor para la colección de elementos coincidentes cuando se utiliza para establecer valores de atributo.

Sintaxis:

$(selector).attr(attribute_name, new_value)

El método attr() utilizado aquí es para establecer un nuevo valor para el atributo, que toma el parámetro como el nombre y el valor del atributo.

Ejemplo:

<html>
  <head>
    <title>Set New Attribute</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
      $(document).ready(function () {
        $("button").click(function () {
          $("#naya").attr("href", "https://www.youtube.com/");
        });
      });
    </script>
  </head>

  <body>
    <p><a href="https://www.google.com/" id="naya">ATT_Link</a></p>
    <button>new value</button>
    <p>
      first, you can view the link and then click on button new value. it will
      change the attribute value.
    </p>
  </body>
</html>

Nota: guarde el archivo como HTML y ejecútelo en el navegador para obtener información clara.

El ejemplo anterior muestra que el nombre del atributo es href, y su nuevo valor es un enlace a youtube. El selector es una etiqueta cuyo nuevo valor se establece.

El selector utilizado aquí es naya, es decir, el id de la etiqueta angular con href. Cuando ejecute este código en el navegador, verá lo siguiente:

después de ejecutar el código

Aquí puede ver un enlace y un botón. Cuando haga clic por primera vez en el enlace, se abrirá google.com, como se menciona en el código.

página de inicio de google

Después de eso, cuando haga clic en el botón llamado new value, verá que el valor inicial del atributo href cambia a youtube.com. Después de hacer clic en el botón, activará la función click y luego cambiará el valor del atributo con la ayuda del método attr().

Echa un vistazo a la captura de pantalla a continuación:

página de inicio de youtube

Autor: Shiv Yadav
Shiv Yadav avatar Shiv Yadav avatar

Shiv is a self-driven and passionate Machine learning Learner who is innovative in application design, development, testing, and deployment and provides program requirements into sustainable advanced technical solutions through JavaScript, Python, and other programs for continuous improvement of AI technologies.

LinkedIn

Artículo relacionado - jQuery Attribute