JS里面的DOM操作是啥
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JS里面的DOM操作是啥相关的知识，希望对你有一定的参考价值。
如题 才学5天JS的新人 求教 JS里面的DOM是什么 节点是什么？
还有的就是
<p id="X">你好，我是某某</p>
p1=document.getElementById('X') 这个到底是什么意思 是把ID为X的元素赋予p1这个变量么？
document.write('p1')
那么最后输出的 却是一堆代码啊
DOM(即 Document Object Mode) 是 W3C（万维网联盟）的标准。
DOM 定义了访问 html 和 XML 文档的标准：“W3C 文档对象模型 （DOM） 是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。”
W3C DOM 标准被分为 3 个不同的部分：
核心 DOM - 针对任何结构化文档的标准模型
XML DOM - 针对 XML 文档的标准模型
HTML DOM - 针对 HTML 文档的标准模型
根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点：
整个文档是一个文档节点
每个 HTML 元素是元素节点
HTML 元素内的文本是文本节点
每个 HTML 属性是属性节点
注释是注释节点
HTML DOM 将 HTML 文档视作树结构。这种结构被称为节点树。通过 HTML DOM，树中的所有节点均可通过 javascript 进行访问。所有 HTML 元素（节点）均可被修改，也可以创建或删除节点。
DOM 处理中的常见错误是希望元素节点包含文本。举个栗子：<title>DOM 教程</title>，元素节点 <title>，包含值为 "DOM 教程" 的文本节点。
可通过节点的 innerHTML 属性来访问文本节点的值。
一些常用的 HTML DOM 方法：
getElementById(id) - 获取带有指定 id 的节点（元素）
appendChild(node) - 插入新的子节点（元素）
removeChild(node) - 删除子节点（元素）
一些常用的 HTML DOM 属性：
innerHTML - 节点（元素）的文本值
parentNode - 节点（元素）的父节点
childNodes - 节点（元素）的子节点
attributes - 节点（元素）的属性节点
DOM操作示例
<html><body>
<p id="p1">Hello World!</p>
<script>
document.getElementById("p1").innerHTML="New text!";
//内容变更为new text
document.getElementById("p1").style.color="blue";
//蓝色
</script>
</body>
</html> 参考技术A 输出的是：（你那个p1有引号吗？）
你好，我是某某
p1
p1=document.getElementById('X') ：获取通过document，根据ID为'X'来获取元素(对象)，存放在变量p1处。
还有就是：<p id="X">你好，我是某某</p>的X和p1=document.getElementById('X')的X，是不一样的。 参考技术B DOM即document object Model，即文档对象模型。说白了就是：只要你通过document获取的元素对象，那么你操作的元素就是一个对象。对象就是指：一堆属性和方法的集合。你写的那个代码意思是：通过文档去获取id属性名为x元素，并把获取到的id值赋值给变量p1。所以输出的结果是X。并且，你的代码p1=document.getElementById('X')前面应该加上var。虽然这种写法是正确的，但是这会涉及到作用域的问题！
以上是关于JS里面的DOM操作是啥的主要内容，如果未能解决你的问题，请参考以下文章