介绍javascript DOM的操作，更新，遍历，添加
首先列出来HTML代码等待嵌套脚本
<!DOCTYPE html>
<html>
<body>
<dl id="drink-menu" style="border:soild 1px #ccc;padding:6px;">
<dt id="摩卡咖啡">摩卡咖啡</dt>
<dd id="橙汁">橙汁</dd>
<dt id="可乐">可乐</dt>
</dl>
</body>
</html> 遍历操作
遍历父节点dl的所有标签并输出innertext
添加代码如下
<script language='javascript'>
//javascipt.cookie(); DOM的操作，更新，遍历，添加，删除css选择getElementsbyclassname()
var menu=document.getElementById('drink-menu');
var len=menu.children.length;//没有子节点，不能用children函数
//var len=menu.length;
var str="";
for(var i=0;i<len;i++)
{
str=str+i+"="+menu.children[i].innerText+",";
}
alert(str);
//menu.innerHTML="<script> alert()
</Script>
添加操作
<script language='javascript'>
var tagp=document.createElement("p");//创建新的标签
tagp.id="new";
tagp.innerText="tea";
var z=document.getElementById("drink-menu");//提取父节点
var dd=document.getElementsByTagName("dd");
z.insertBefore(tagp,dd);//将新创建的放入dd标签之前
</Script>更改脚本文件的css属性
<script language='javascript'>
var test=document.getElementById('橙汁');
test.innerText="JavaScript";
test.style.color="#ff0000";
test.style.fontWeight="bold";
//test.style.backgroundColor="red";
</Script>
594
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
