JQuery的一些小小的知识
Posted 哈喽杏红
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JQuery的一些小小的知识相关的知识,希望对你有一定的参考价值。
过滤
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>过滤</title> </head> <body> <ul class="ul"> <li>北京大学1</li> <li id="li2">北京大学2</li> <li>北京大学3</li> </ul> </body> <script src="../js/jquery.min.js"></script> <script> /*eq索引值*/ console.log($("li:eq(1)")); /*.eq 方法*/ console.log($("li").eq(1)); console.log($("ul").hasClass("ul")); console.log($("li").filter("#li2")); console.log($("li").get()); //等于 console.log($("li")[0]); </script> </html>
map方法has方法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>map方法has方法</title> </head> <body> <p>123</p> <form> <input type="text" name="name" value="John"/> <input type="text" name="password" value="password"/> <input type="text" name="url" value="http://ejohn.org/"/> </form> <input type="text" name="ccy" value="ccy"> <ul> <li>list item 1</li> <li>list item 2 <ul> <li>list item 2-a</li> <li>list item 2-b</li> </ul> </li> <li>list item 3</li> <li>list item 4</li> </ul> </body> <script src="../js/jquery.min.js"></script> <script> $("p").append($("input").map(function () { return $(this).val(); }).get().join(",")); /*参数1:要查找的元素 * 参数2:查找的范围*/ console.log($("input",$("form"))); /*get*() (get后边括号是空的)一次把全部的jquery对象转换成js对象*/ $(‘li‘).has(‘ul‘).css(‘background-color‘, ‘red‘); </script> </html>
查找
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>查找</title> </head> <body> <ul> <li>北京大学1 <ul> <li>理学院</li> <li>法学院</li> </ul></li>> <li>北京大学2</li> </ul> <ul> <li>清华大学1</li> <li>清华大学2</li> </ul> <p><span>Hello</span>, how are you?</p> </body> <script src="../js/jquery.min.js"></script> <script> console.log($("ul").children()); console.log($("p").find("span")); </script> </html>
以上是关于JQuery的一些小小的知识的主要内容,如果未能解决你的问题,请参考以下文章