亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

元素選擇方法

original 2019-01-30 22:04:36 369
abstrait:<!DOCTYPE html><html><head><meta charset="UTF-8"><title>選擇元素獲取</title></head><body><ul><li id="item1">ONE</li><

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>選擇元素獲取</title>

</head>

<body>

<ul>

<li id="item1">ONE</li>

<li>TWO</li>

<li>THREE</li>

</ul>


<img src="http://imgsrc.baidu.com/forum/pic/item/ec3ec65c1038534322e31ac69a13b07eca80883a.jpg" alt="" name="pic">

<form action="" name="login">

<input type="text" placeholder="用戶名">

<input type="password" placeholder="密碼" name="" id="">

<button>登錄</button>

</form>

<p><a href="ipnx.cn">php中文網(wǎng)</a></p>


<script>

  //使用ID來選擇元素

  //document是Document對象的一個引用,是一個全局變量

  //let 當(dāng)前代碼塊有效

  let item1 = document.getElementById('item1');

  

  //設(shè)置ID元素樣式

  item1.style.backgroundColor = 'orange';


  //使用class選擇元素

   let item2 = document.getElementsByClassName('item2');

   // console.log(item2);

   // 設(shè)置class元素樣式

   item2[0].style.backgroundColor = 'blue';

   //使用document對象調(diào)用,在元素上調(diào)用,一般在父級上調(diào)用

   document.getElementsByClassName('ul').item(0)//返回UL

           .getElementsByClassName('item3').item(0)//返回li

           .style.backgroundColor='green';


     //使用TAG標(biāo)簽選擇元素

     let list_t = document.getElementsByTagName('ul').item(0);

     list_t.style.backgroundColor = 'lightgreen';

     //獲取所有l(wèi)i元素

     let list_li = document.getElementsByTagName('li');

     console.log(list_li.length)

     console.log(list_li)

     for (let i = 0;i <list_li.length; i++){

           list_li[1].style.backgroundColor='lightpink';

     }

//以文檔對象的方式來訪問這些特定的元素集合

//document.images 獲取所有img元素 返回數(shù)組

document.images[0].style.width='350px';//標(biāo)簽數(shù)字索引

//推薦此用法?。?!

document.images['pic'].style.width='180px';//name屬性

//如果將images看成對象 name就可以看屬性

document.images.pic.style.width='250px';//name做為images對象的屬性

//form屬性 獲取頁面中所有的form

document.form.login.style.backgroundColor='purple';//個人比較喜歡用此方法!!!!!!!!!!!!!!!!!!!



//通過CSS選擇器獲取元素

let list_01 = document.querySelectorAll('li');//根據(jù)標(biāo)簽選擇器 li來獲取

console.log(list_01);

list_01[0].style.backgroundColor='red';

list_01.item(1).style.backgroundColor='gray';





</script>





</body>

</html>


Professeur correcteur:滅絕師太Temps de correction:2019-01-31 09:21:44
Résumé du professeur:標(biāo)簽和class獲取的都是元素的集合所以需要用數(shù)字下標(biāo)索引

Notes de version

Entrées populaires