在此示例中,我们使用
filter()函数的
selector 属性。在这里,
filter()函数返回类名称为
para 的所有段落元素。有一些div元素,段落元素等。与类别
para 相关的四个段落元素中有三个。
我们必须单击给定的按钮才能看到结果。
<!DOCTYPE html> <html> <head> <style> div{ font-size: 20px; font-weight: bold; } </style> <script src="/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> function fun(){ $(document).ready(function(){ $("p").filter(".para").css({"background": "yellow"}); }); } </script> </head> <body> <h2> Welcome to the lidihuo.com </h2> <h4>This is an example of using the jQuery's filter() method. </h4> <div id = "div1"> This is first div element. </div> <p class = "para"> This is first paragraph element </p> <div id = "div2"> This is second div element. </div> <p class = "para"> This is second paragraph element </p> <p class = "para"> This is third paragraph element </p> <p> Click the following button to see the effect. </p> <button onclick = "fun()"> click me </button> </body> </html>
输出
Welcome to the lidihuo.com
This is an example of using the jQuery's filter() method.
<!DOCTYPE html> <html> <head> <style> p{ font-size: 20px; font-weight: bold; } </style> <script src="/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> function fun(){ $(document).ready(function(){ $("p").filter(function(index) { if(index == 1 || index == 3 || index == 5){ return true; } }).css({"background": "yellow"}); }); } </script> </head> <body> <h2> Welcome to the lidihuo.com </h2> <h4> This is an example of using the jQuery's filter() method. </h4> <p class = "para1"> P1 </p> <p class = "para2"> P2 </p> <p class = "para3"> P3 </p> <p class = "para4"> P4 </p> <p class = "para5"> P5</p> <p class = "para6"> P6 Click the following button to see the effect. </p> <button onclick = "fun()"> click me </button> </body> </html>
输出
Welcome to the lidihuo.com
This is an example of using the jQuery's filter() method.