jQuery :containsで指定の文字列を含む要素のサンプル

2023年3月24日

環境
Google Chrome　111.0.5563.65（Official Build）
Windows 10 Home 64bit
jquery 3.6.3

書式
$(“要素タグ:contains('指定の文字列’)").css(属性,値);
「:contains)」を利用して指定の文字列を含む要素を取得します。

使用例

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("#chk").click(function(){
        
        $("p:contains('tokyo')").css("background","skyblue");
  });
});
</script>
</head>
<body>

<p>tokyo</p>
<p>oosaka</p>
<p>fukuoka</p>

<button id="chk">検証</button>

</body>
</html>

結果
「検証」ボタンを押すと、文字「tokyo」を含むP要素の背景色をskyblueにします。

jQuery

Posted by arkgame

関連記事: