JavaScript 之 jquery选择器
Posted 还能做好什么
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaScript 之 jquery选择器相关的知识,希望对你有一定的参考价值。
很好理解,我们之前选择进行DOM选择时,都用的是,docment.getElementById() , document.getElementsByTagName()
,等。
这样的代码,一般情况下可用,但如果存在层级关系,这种情况下我们总是需要递归选择。例如:
如,查找<table class="green">
里面的所有<tr>
,一层循环实际上是错的,因为<table>
的标准写法是:
<table> <tbody> <tr>...</tr> <tr>...</tr> </tbody> </table>
很显然,我们要进行 for 嵌套,才可以找到所有 tr 标签。
jquery
jquery对象,是一个标签组,类似数组。
jquery查找方法:
使用jQuery选择器分别选出指定元素: 1.仅选择javascript 2.仅选择Erlang 3.选择JavaScript和Erlang 4.选择所有编程语言 5.选择名字input 6.选择邮件和名字input <!-- html结构 --> <div id="test-jquery"> <p id="para-1" class="color-red">JavaScript</p> <p id="para-2" class="color-green">Haskell</p> <p class="color-red color-green">Erlang</p> <p name="name" class="color-black">Python</p> <form class="test-form" target="_blank" action="#0" onsubmit="return false;"> <legend>注册新用户</legend> <fieldset> <p><label>名字: <input name="name"></label></p> <p><label>邮件: <input name="email"></label></p> <p><label>口令: <input name="password" type="password"></label></p> <p><button type="submit">注册</button></p> </fieldset> </form> </div>
凡是查找,都用 $(‘ xxxxxx ‘ ) ,其中xxxxxx 是具体的筛选方案。 解决方案如下。
var js=$(‘#para-1‘); //通过名字查找 var erl=$(‘.color-red.color-green‘); //通过 class查找,既要满足 color-red 又要满足 color-green var jserl=$(‘.color-red‘); //class 查找, 只要含有 color-red 的,都会被查找 var allcpl=$(‘#test-jquery>p‘); // 所有在 名为 ’test-jquery‘ 标签下的 p标签 vat nameinput=$(‘input[name=‘name‘]‘); // 首先是个 input,然后 name要满足 vat nameinput=$(‘input[name="name"],input[name="email"]‘); // 是个input,name是 name 或 email
以上是关于JavaScript 之 jquery选择器的主要内容,如果未能解决你的问题,请参考以下文章
JavaScript之jQuery-10 T-Query(T-Query基本选择器T-Query对象操作方法创建元素事件绑定)