Skip to content
Related Articles

Related Articles

jQuery | [attribute|=value] Selector
  • Last Updated : 26 Feb, 2019

The [attribute|=value] selector is used to select each element with a specific attribute, with a specific string value (like “geeks”) or starting string followed by a hyphen (like “geeks-forgeeks”).

Syntax:

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

Parameter :

  • attribute : This parameter is required to specify the attribute to be searched.
  • value : This parameter is required to specify the string the attribute value should start with.

Example-1:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <script src=
  </script>
   
  <script>
        $(document).ready(function() {
            $("p[title|='GeeksForGeeks']").css(
              "background-color", "green");
        });
    </script>
</head>
  
<body>
    <center>
        <h1>Geeks For Geeks</h1>
        <p title="GeeksForGeeks">
          Geeks1
      </p>
        
        <p title="google">
          Geeks2
      </p>
        
        <p title="Tom">
          Geeks3
      </p>
        
        <p title="See You GeeksForGeeks">
          Geeks4
      </p>
        
        <p title=
      "GeeksForGeeks-is the best palce to learn">
          Geeks5
      </p>
    </center>
  
</body>
  
</html>

chevron_right


Output:

Example-2:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <script src=
  </script>
   
  <script>
        $(document).ready(function() {
            $("p[title|='google']").css(
              "background-color", "green");
        });
    </script>
</head>
  
<body>
    <center>
        <h1>Geeks For Geeks</h1>
        <p title="GeeksForGeeks">
          Geeks1
      </p>
        
        <p title="google">
          Geeks2
      </p>
        
        <p title="google- tom">
          Geeks3
      </p>
        
        <p title="See You GeeksForGeeks">
          Geeks4
      </p>
        
        <p title=
       "GeeksForGeeks-is the best palce to learn">
          Geeks5
      </p>
    </center>
  
</body>
  
</html>

chevron_right


Output:




My Personal Notes arrow_drop_up
Recommended Articles
Page :