JavaScript

Document Object Model文档对象模型。可以理解为把html文档抽象成了对象。

 

我们html文档在被加载到浏览器内存中，会形成一棵dom树。也html里的所有的标签、属性、文档都按照层级结构转换成树上的节点，类似一棵“家谱树”。

 

常见的dom对象：

document: 整个html文档抽象成的对象

element: 标签抽象成的对象

Attribute: 属性抽象成的对象

Text: 文本抽象成的对象

(一)element的操作

1.   获取标签对象的方法

a)    document.getElementById(“ID值”)—返回：element对象

b)   document.getElementsByTagName(“标签的名称”);--返回：element数组

c)    document.getElementsByClassName(“class属性值”);--返回：element数组

d)   document.getElementsByName(“name属性值”);--返回：element数组

上边四个方法，除了document可以用，element对象也可以用。

2.   增加一个标签对象的方法

a)    document.createElement(“标签名称”);

b)   父element.appendChild(子element);把标签添加到dom树里，从而显示到页面上

3.   删除标签对象的方法

a)    element.remove()

(二)attribute的操作

1.   获取属性值

a)    Element.属性名

b)   Element.getAttribute(“属性名”)

2.   设置属性值

如果属性已经存在，就是修改属性值；如果属性不存在，增加属性

a)    Element.属性名 = 属性值

b)   Element.setAttribute(“属性名”,”属性值”);

3.   删除属性

a)    Element.removeAttribute(“属性名”);

(三)标签体的操作

1.   获取标签体：element.innerHTML

2.   设置标签体：element.innerHTML = “标签体的内容”;

3.   获取标签体里的文本：element.innerText

4.   设置标签体里的文本：element.innerText = “文本值”;

上边的两种设置方式，都是把原有的标签体覆盖掉

二、引用数据类型

Array

Date

Math

RegExp