Javascript深入浅出学习笔记(10)

最新推荐文章于 2022-03-08 18:22:52 发布

cheneychoi

最新推荐文章于 2022-03-08 18:22:52 发布

阅读量354

点赞数

本文详细介绍了如何使用JavaScript操作DOM，包括document类型的操作如加载外部资源、element类型的获取与修改特性等。此外还介绍了如何通过DOM API获取和设置HTML元素的属性，并演示了创建新的DOM元素的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.document类型
document.write() 可以使用它动态地包含外部资源
document.writeln()
document.open()
document.close()

<script type="text/javascript">
document.write("<script type=\ "text/javascript\"> src=\"files.js\">"+"<\/script>");
</script>

2.element类型

<div id="myDiv"></div>
var div = getElementById("myDiv");
alert(div.tagName); /DIV
alert(div.tagName = div.nodeName);//true

if(element.tagName.toLowerCase() == "div"){
//将标签名转换成了全部小写
}

（1）HTML元素
id，元素在文档中的卫衣标识符
title，有关元素的附加说明信息
lang,元素内容的代码语言
dir，语言方向，值为ltr或者rtl
className，与元素的class特性对应，即元素指定的CSS类

（2）取得特性
操作特性的DOM方法有三个，分别是getAttribute()、setAttribute()和removeAttribute()。

getAttribute()

（3）设置特性
setAttribute(“要设置的特性名”,“值”);
如果特性已经存在，setAttribute()会以指定的值替换现有的值。

div.mycolor = "red";
alert(div.getAttribute("mycolor"));//null

为DOM元素添加一个自定义属性，该属性不会自动成为元素属性

4.attributes属性
attributes属性中包含一个NamedNodeMap动态集合，该对象拥有下列方法
getNamedItem(name);返回nodeName等于name的节点
removeNamedIt(name);从列表中移除nodeName属性等于name的节点
setNamedItem(node):向列表中添加节点，以nodeName属性为索引
item(pos):返回位于数字pos位置处的节点

var id = element.attributes.getNamedItem("id").nodeValue;
var id = element.attributes["id"].nodeValue;

5.创建元素
document.createElement()

var div = document.creatElement("<div id=\"myNewDiv\" class=\"box\" </div>");