li[1].css("color","blue"); // 問題：li是個數組，為什么這里加上[i]會沒有效果？換成index也不行，為什么呢？
<!DOCTYPE html>
<html>
<head>
? ? <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
? ? <title></title>
? ? <style>
? ? .left {
? ? ? ? width: auto;
? ? ? ? height: 150px;
? ? }
? ??
? ? .left div {
? ? ? ? width: 150px;
? ? ? ? height: 120px;
? ? ? ? padding: 5px;
? ? ? ? margin: 5px;
? ? ? ? float: left;
? ? ? ? background: #bbffaa;
? ? ? ? border: 1px solid #ccc;
? ? }
? ? </style>
? ? <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
? ? <h2>each方法</h2>
? ? <div class="left first-div">
? ? ? ? <div class="div">
? ? ? ? ? ? <ul>
? ? ? ? ? ? ? ? <li>list item 1</li>
? ? ? ? ? ? ? ? <li>list item 2</li>
? ? ? ? ? ? ? ? <li>list item 3</li>
? ? ? ? ? ? </ul>
? ? ? ? </div>
? ? ? ? <div class="div">
? ? ? ? ? ? <ul>
? ? ? ? ? ? ? ? <li>list item 4</li>
? ? ? ? ? ? ? ? <li>list item 5</li>
? ? ? ? ? ? ? ? <li>list item 6</li>
? ? ? ? ? ? </ul>
? ? ? ? </div>
? ? </div>
? ? <br/>
? ? <button>點擊：each方法遍歷元素</button>
? ? <button>點擊：each方法回調判斷</button>
? ? <script type="text/javascript">
? ? $("button:first").click(function() {
? ? ? ? //遍歷所有的li
? ? ? ? //修改每個li內的字體顏色
? ? ? ??
? ? ? ? $("li").each(function(index, element) {
? ? ? ? ? ? $(this).css('color','red')
? ? ? ? })
? ? })
? ? </script>
? ? <script type="text/javascript">
? ? $("button:last").click(function() {
? ? ? ? //遍歷所有的li
? ? ? ? //修改偶數li內的字體顏色
? ? ? ? var li=$("li");
? ? ? ? li.each(function(index,element){
? ? ? ? ? ??
? ? ? ? ? ? if(index%2){
? ? ? ? ? ? ? ? li[1].css("color","blue");
? ? ? ? ? ? // 問題：li是個數組，為什么這里加上[i]會沒有效果？換成index也不行，為什么呢？
? ? ? ? ? ? }
? ? ? ? });
? ? ? ? //在javascript中0代表false，非0代表true
? ? ? ? // $("li").each(function(index, element) {
? ? ? ? // ? ? if (index % 2) {
? ? ? ? // ? ? ? ? $(this).css('color','blue')
? ? ? ? // ? ? }
? ? ? ? // });
? ? })?
? ? </script>
</body>
</html>
2016-12-17
console.log(li[1]);
輸出的是三個標簽內容，不是dom對象
不妨把li[1]改為eq(1)
console.log(li.eq(1));
打印的是，是可以操作dom元素的
2016-12-19
jquery對象是一個類似數組的對象，可以通過[index]的方法得到相應的DOM對象
var lis = $('li'); ?//這是jq對象
var li = lis[0]; ?//這是DOM對象
你寫的li[1].css這是DOM對象用jquery的方法，當然不行啦
li.eq[index]這才是jq的方法。
剛開始學很容易二者的一些方法記混淆，多用就好啦