www.4688.comJQuery选择器细节-遁地龙卷风

0.环境

  <input type=”checkbox”  value=”lol”/>lol

  var lol = document.getElementsByTagName(“input”)[0];

<body>

2.DOM core

  lol.setAttribute(“checked”,”checked”);

  元素增加了checked标记,这时lol.checked的价为true

  <input type=”checkbox”  checked=“checked” value=”lol”/>lol

  其实checked标记,存在就是采用,下面的写法就可以实现默认选中

  <input type=”checkbox”  checked  value=”lol”/>lol

  于浏览器解析文本的早晚就默认选中.

 

</div>

1.HTML DOM

  a.lol.checked = true;

    属性的价好免是lol,只要转为布尔值的上吧true就好,取值时只有发true、false两栽  

    不见面增加checked标记

  b.lol.click();

    不见面加checked标记,这时lol.checked的价为true

<div></div><!–可以吃找到–>

has过滤器过滤的是后人元素

</body>

<div id=”dnf”>
  <p class=”lol”>123</p>
  <p>123</p>
  <p>123</p>
</div>

      <p>lol</p>

var c= $(“has(.lol)”).length
alert(a);//0
alert(b);//1

2.情节过滤器-has

<div>

           <p></p>

<body>

<div><!–不可以吃找到,有文件元素–>

alert($(“div>p”).length);//2

1.层次选择器-子元素选择器

$(“div.lol”)

 

未完待续!

(2)
<body>
  <ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>   
  </ul>
  <li>6</li>
  <li>7</li>
  <li>8</li>
  <li>9</li>
</body>
$(“ul li:nth-child(2n)”).css(“background”,”red”);

//ul下的li,innerText为2,4为红色
//innerText也6,7,8,9的li的父元素是body,6每当body中凡第2独元素,所以innerText为6的li背景色吧红色
///当然innerText为8底li背景色吧为革命

<body>
  <ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
  </ul>
</body>
$(“ul li:nth-child(2n)”).css(“background”,”red”);
$(“li:nth-child(2n)”).css(“background”,”red”);
个别个告知句的效力同样,因为有着li元素的父元素都是ul

5.子元素选择器,这里既:nth-child()为条例

</div>

var a = $(“#dnf p:has(.lol)”).length //这样是获得不至之
var b = $(“#dnf:has(p):has(.lol)”).length

“#dnf
p:has(.lol)”的意是是否发生这么的p元素,它是利用id为dnf的后生元素,且改p元素的后元素被来采取class为lol的素

“:has(.lol)”
的意思是是否来这样的素,它的后生元素中起class为lol的元素,从html标签开始逐层遍历

(1)

//会定位到body的子div,然后定位子p

3.情节过滤选择器-empty

      <div>

素的挑是冲元素以父元素中之职位还是唯一性决定的

//ul下的li,innerText为2,4为红色
$(“li:nth-child(2n)”).css(“background”,”red”);

4.应用了class为lol的div元素

      </div>

<html>

“#dnf:has(p):has(.lol)”的意是是否发生这样的素,它的id是dnf,且后代元素中生出p元素,且发出class为lol的元素”
html body div

//逐层遍历符合的因素
alert($(“body>div>p”).length)//1

</html>

欢迎补充指正!

</body>

alert(c);//3

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

*
*
Website