javaScript的DOM

时间 2019-11-13

标签 javascript dom 栏目 JavaScript 繁體版

原文原文链接

DOM是Document Object Model的缩写，简称文档对象模型javascript

经过 HTML DOM，可访问 JavaScript HTML 文档的全部元素。java

1、访问HTML元素节点code

1.经过 id 访问 HTML 元素对象

在 DOM 中查找 HTML 元素的最简单的方法，是经过使用元素的 id。blog

使用document.getElementById方法访问HTML元素图片

若是找到该元素，则该方法将以对象（在 x 中）的形式返回该元素。ip

若是未找到该元素，则 x 将包含 null。文档

2.经过标签名访问 HTML 元素get

document.getElementsByTagNameit

3.经过类名访问 HTML 元素

document.getElementsByClassName

<head>

//id

var p1=document.getElementById("demo");

console.log(p1);

var res1=p1.innerHTML;

console.log(res1);

//标签名

var p2=document.getElementsByTagName("p");

console.log(p2);

var res2=p2[1].innerHTML;

console.log(res2);

//类名

var p3=document.getElementsByClassName("hello");

var res3=p3[0].innerHTML;

console.log(res3);

</script>

3、改变HTML内容

1.改变 HTML 输出流

经过document.write直接改变HTML页面的内容

document.write("hello");

2.改变 HTML 内容

经过innerHTML属性直接修改HTML的内容

document.getElementById("demo").innerHTML="51code";

3.改变HTML样式

document.getElementById("test").style.background="red";