jQuery – セレクタのサンプルが含まれています
それをする
ボタンをクリックして、包含セレクタの周りを再生します。
<html>
<head>
<title>jQuery contains selector example</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<style type="text/css">
#msg{
padding:8px;
hright:100px;
}
</style>
</head>
<body>
<h1>jQuery contains selector example</h1>
<div id="msg"></div>
<ul>
<li>One</li>
<li>two</li>
<li>three</li>
<li>four</li>
<li>five</li>
</ul>
<p>
This is a paragraph 1 - google.com
</p>
<p>
This is a paragraph 2 - mkyong.com
</p>
<br/><br/>
<button>p:contains(paragraph 1)</button>
<button>p:contains(mkyong)</button>
<button>li:contains(three)</button>
<script type="text/javascript">
$("button").click(function () {
var str = $(this).text();
$('p, li').css("border", "0px solid #000000");
$(str).css("border", "1px solid #ff0000");
$('#msg').html("<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
style="display:block; text-align:center;"
data-ad-format="fluid"
data-ad-layout="in-article"
data-ad-client="ca-pub-2836379775501347"
data-ad-slot="6894224149"></ins>
<script>
(adsbygoogle = window.adsbygoogle ||[]).push({});
</script><h2>Button clicked : " + str + "</h2>");
});
</script>
</body>
</html>
リンク://wp-content/uploads/jQuery/jQuery-contains-selector.html[デモを試してください]