jQuery選擇器獲取元素並非是動態

antzone發表於2017-04-13
jQuery

使用jQuery選擇器獲取元素的時候，需要注意一點，那就是它並非動態的。

程式碼例項如下:

[HTML] 純文字檢視 複製程式碼
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script>
$(document).ready(function () {
  var $lis = $("ul li");
  var len = $lis.length;
  var $li = $("<li>螞蟻部落六</li>");
  $("ul").append($li);
  $("div").text($lis.length);
});
</script>
</head>
<body>
<div></div>
<ul>
  <li>螞蟻部落一</li>
  <li>螞蟻部落二</li>
  <li>螞蟻部落三</li>
  <li>螞蟻部落四</li>
  <li>螞蟻部落五</li>
</ul>
</body>
</html>

上面的程式碼中，為ul元素新增了一個新的li元素。

但是最後列印出來$lis的長度依然是5，而不是6，這一點和getElementsByTagName()有區別。

具體可以參閱getElementsByTagName()獲取元素是動態的一章節。

相關文章