jQuery | Selector [atributo$=valor]

El selector [atributo$=valor] se usa para seleccionar cada elemento con un atributo específico, con una string final específica.

Sintaxis:

$("[attribute$='value']")

Parámetro:

  • atributo: Este parámetro es necesario para especificar el atributo a buscar.
  • valor: este parámetro es necesario para especificar la string, es decir, el valor debe terminar.

Ejemplo 1:

<!DOCTYPE html>
<html>
  
<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
  </script>
    
  <script>
        $(document).ready(function() {
            $("a[href$='.org']").css(
              "background-color", "green");
        });
    </script>
</head>
  
<body>
    <center>
        <h1>GeeksForGeeks</h1>
        <a href=
        "https://www.geeksforgeeks.org/">
          geeksforgeeks.org
        </a>
        <br>
        
        <a href=
        "http://www.google.com">
          Google.com
        </a>
        <br>
        
        <a href=
        "http://www.wikipedia.org">
          wikipedia.org
        </a>
    </center>
  
</body>
  
</html>

Salida:
antes de hacer clic en los enlaces:

Después de hacer clic en los enlaces GeeksForGeeks:

Después de hacer clic en los enlaces de Google:

Después de hacer clic en los enlaces de wikipedia:

Ejemplo-2:

<!DOCTYPE html>
<html>
  
<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
  </script>
   
  <script>
        $(document).ready(function() {
            $("h3[id$='.org']").css(
              "background-color", "green");
        });
    </script>
</head>
  
<body>
    <center>
        <h1>GeeksForGeeks</h1>
        <h3 id="geeksforgeeks.org/">
          geeksforgeeks.org
      </h3>
        
        <h3 id="google.com">
          Google.com
      </h3>
        
        <h3 id="wikipedia.org">
          wikipedia.org
      </h3>
    </center>
  
</body>
  
</html>

Producción:

Publicación traducida automáticamente

Artículo escrito por rathbhupendra y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *