Penjelasan terperinci tentang cara jQuery menggunakan penapis mengandungi untuk mencapai padanan

Penjelasan terperinci tentang cara jQuery menggunakan penapis mengandungi untuk mencapai padanan_jquery yang tepat

WBOY

Lepaskan： 2016-05-16 15:13:48

asal

1396 orang telah melayarinya

Contoh dalam artikel ini menerangkan cara jQuery menggunakan penapis mengandungi untuk mencapai padanan tepat. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:

:mengandungi pemilih memilih elemen yang mengandungi rentetan yang ditentukan.

Rentetan boleh menjadi teks yang terkandung terus dalam elemen, atau terkandung dalam elemen kanak-kanak.

sering digunakan dengan elemen/pemilih lain untuk memilih elemen yang mengandungi teks tertentu dalam kumpulan tertentu, seperti:

$("p:contains(is)") bermaksud memilih semua

Contoh lain:

$("p:contains(张三)") atau $("p:contains("张三")") bermaksud memilih semua

Anda juga boleh menggunakan pembolehubah dalam pemilih ini untuk mencapai tujuan pemilihan, seperti:

$(document).ready(function(){
var ddd="John";
$("div:contains(‘" + ddd + "‘)").css("color", "#f00");
});

Salin selepas log masuk

Kami juga boleh menggunakan kaedah penapis jquery dan mengandungi kaedah bersama-sama untuk mencapai padanan yang lebih kabur, seperti:

$(document).ready(function(){
$(".box").filter(":contains(李)").css("color", "#f00");
});

Salin selepas log masuk

bermaksud untuk menetapkan warna teks kotak yang mengandungi "李" kepada merah.

jQuery menggunakan penapis mengandungi untuk mencapai padanan tepat:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title></title>
  <!--<script src="jquery.min.js" type="text/javascript"></script>-->
  <script src="jquery.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function () {
      //根据select中的option的文本来执行选中
      //$("#selectbox option[text='第二项']");
      //$("#selectbox option").filter("[text='第二项']");
      //上面两种写法都是错误的
      //正确写法
      $("#btn4").click(function () {
        var $option =$("#selectbox option:contains('第二项')").map(function(){
          if ($(this).text() == "第二项") {
            return this;
          }
        });
        alert($option.length > 0 &#63; "有对象" : "无对象");
        $option.attr("selected", true);
      });
    });
  </script>
</head>
<body>
  <form id="form1">
  <div>
    <select id="selectbox">
      <option value="1">第一项</option>
      <option value="2">第二项</option>
      <option value="21">第二项1</option>
    </select>
    <input type="button" id="btn4" value="contains测试" />
  </div>
  </form>
</body>
</html>

Salin selepas log masuk

Pembaca yang berminat dengan lebih banyak kandungan berkaitan jQuery boleh menyemak topik khas di tapak ini: "Kesan seret JQuery dan ringkasan kemahiran", "ringkasan kemahiran sambungan jQuery" , "Ringkasan kesan khas klasik biasa JQuery", "ringkasan penggunaan jQuery dan kesan khas penggunaan" dan "ringkasan penggunaan pemilih jquery"

Saya harap artikel ini akan membantu semua orang dalam pengaturcaraan jQuery.