サマリー：<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>DOM練習(xí)作業(yè)</title> </head> <body> <ul id="ulbox"> <li>列表1&l
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>DOM練習(xí)作業(yè)</title>
</head>
<body>
<ul id="ulbox">
<li>列表1</li>
<li>列表2</li>
<li>列表3</li>
<li>列表4</li>
<li>列表5</li>
</ul>
<ul>
<li>item1</li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
<li>item5</li>
</ul>
<form action="" name="formbox" id="formYm">
<input type=te"text" name="user1" id="user1" value="請輸入用戶名"/>
<input type="password" name="user2" id="user2" value="請輸入密碼" />
</form>
<p><a href="http://ipnx.cn">點擊跳轉(zhuǎn)php中文網(wǎng)</a></p>
<img src="images/1.jpg" name="images1" />
<ul class="ul">
<li class="red">列表1</li>
<li>列表2</li>
<li class="green">列表3</li>
<li>列表4</li>
<li class="coral large">列表5</li>
</ul>
<script>
//document.getElementById() 獲取id
let ul =document.getElementById("ulbox")
//ul變量更改ul的背景顏色
ul.style.backgroundColor="yellowgreen";
//document.getElementsByName() 獲取name的值
let name1 =document.getElementsByName("formbox").item(0);
//獲取到form的name名稱查找到位置修改name背景色
name1.style.backgroundColor="#ff2800"
//document.getElementsByTagName("")獲取標簽名
let ul2 = document.getElementsByTagName("ul")[1];
ul2.style.backgroundColor = "red"
//根據(jù)標簽名和name屬性選擇元素
document.forms[0].style.backgroundColor="brown";
document.forms["formYm"].style.backgroundColor="darkcyan";
document.forms.formYm.style.backgroundColor="brown";
document.forms.item(0).style.backgroundColor="red";
//links連接
document.links[0].style.backgroundColor="teal";
//images 圖片
document.images[0].style.width="200px";
//根據(jù)元素的class屬性值獲取元素
let red=document.getElementsByClassName("red");
console.log(red);
red[0].style.backgroundColor="red"
//使用css選擇器來獲取元素
//document.querySelector()返回指定的css選擇器的元素
//document.querySelectorAll()根據(jù)指定的元素，進行修改
</script>
</body>
</html>
添削の先生：韋小寶添削時間：2019-03-07 14:37:48
先生のまとめ：寫的很不錯 js來獲取元素還是蠻簡單的 當(dāng)然也挺重要的