dom是javascript的核心技术,javascript中dom的含义
这篇文章给大家带来了一些关于javascript的知识，主要介绍了DOM和BOM的区别和用法，包括一些相关的操作。来看看吧，希望对你有帮助。
【相关推荐：javascript视频教程，web前端】
I. 简述：何为DOM，何为BOM？
本文开头我想提一下笼统地讲，什么是DOM，什么是BOM，因为这个是文章最终面向的是有一定JavaScript基础，但是对DOM和BOM并不了解，甚至不知道的朋友。
但是，在聊什么是DOM，什么是BOM之前中，请允许我把整个的Javascript的结构给大家展示一下:
上图我们看到有四个元素：JavaScript，ECMAScript，DOM和BOM，那么他们四个之间有什么联系呢？用公式总结它们之间的关系：
我们转到一个一个对它们进行一个概述:
ECMAscript：
ECMAscript更像一个规定，规定了各个浏览器怎么样去执行JavaScript的语法，因为我们知道JavaScript是一种运行在浏览器上的脚本语言！有规定，但是我们是还缺少与页面中各个元素交互的方式，下面这个DOM诞生的时候！
DOM:
一句话总结：DOM为JavaScript提供了一种访问和操作HTML元素的"方法"(之所以不用接口这个词，是怕有些朋友看到接口会吓到，其实是最准确的描述是给JavaScript提供了接口)
BOM:
总之：BOM为JavaScript提供了一种控制浏览器行为的"方法"。
最后，以上三个JavaScript组件中，ECMscript是一种规范，和其余的两个都是提供了"方法"，分别对应HTML元素和浏览器，所以这里我们是针对后面两个：DOM和BOM，进行系统的讲解，我是后面的讲解会尽可能的简单易懂，基础不好也尽可放心食用因为面向小白！
II. DOM及其相关操作
首先我们把它定为先讲解一下DOM的相关知识，我把它定为又分了两块内容:
II.I DOM树
好的，那什么叫DOM树？
可能有些学过DOM的初学者听到这个词会有点奇怪，但其实DOM树并不是什么特别玄幻的东西。相反，对于前端人员，DOM树就是你天天处理的页面的HTML元素所构成那颗树：
BOM树,每个节点可以有两个身份：可以是父节点的子节点，也可以是其他子节点的父节点，下面我们一起观察下面这段代码:
！声明文档类型
html lang=en
头
meta charset=UTF-8
titleDOM _演示/标题
/头
身体
p
a href= 3359blog.csdn.net/QQ _ 52736131 跳探戈的小龙虾/a
/p
/body
上面的代码/html，它的DOM树应该是这样的：
这时候有人会问，你说这么半天的DOM树，跟操作html元素有关吗？
II.II DOM的一些常见的操作元素方法
关于JavaScript中DOM的一些常见的操作html元素的方法，我给你分类介绍一下分成几个子部分:
:
获取节点的DOM方法
//1.元素通过其id属性值获得，并返回一个元素对象。
var element=document . getelementbyid(id _ content)
//2.通过元素的名称属性值获取元素，返回一个元素对象数组。
var element _ list=document . getelementsbyname(name _ content)
//3.通过元素的class属性值获取元素，返回一个元素对象数组。
var element _ list=document . getelementsbyclassname(class _ content)
//4.通过标记名获取元素，这将返回一个元素对象数组。
var element _ list=document . getelementsbytagname(tagname)
获取/设置元素的属性值的DOM方法
//1。获取元素的属性值，参数自然是属性名，比如class，id，href。
var attr=element . get attribute(attribute _ name)
//2.设置元素的属性值。参数自然是元素的属性名和要设置的相应属性值。
Element.set属性(attribute _ name，attribute _ value):
创建节点(Node)的DOM方法
//1。创建一个html元素，参数是元素类型，比如P，h1-5，a，以P为例。
var element=document . createelement( p )
//2.创建一个文本节点，相应的文本内容被传递(注意它是一个文本节点，而不是一个html元素)
var text _ node=document . create text node(text)
//3.创建一个属性节点，传递的参数是对应的属性名。
var attr _ node=document . create attribute(attribute _ name)
Element.set属性节点(attr _ node)特别注意第三个，创建属性节点这个方法，要搭配具体的元素，也就是你想要的先获取某个具体元素element，创建一个属性节点，最后对这个元素添加这个属性节点(setAttributeNode)。
:
增添节点的DOM方法
//1.在元素后面添加一个节点，传入的参数是节点类型。
element.appendChild(节点)
//2.在元素内现有节点的前面插入一个节点，并仍然传入一个节点类型的参数。
Element.insertbefore (new _ node，existing _ node)注意添加节点之前，你要先创建好节点，同时要选好父节点element，第二个方法甚至你还要找好插入位置后面的兄弟节点。
删除节点的DOM方法
//删除元素中的节点。传递的参数是节点类型参数。
Element.removeChild(Node)注意，删除时，要找到对应的父节点element才可以顺利删除。
DOM常见的一些属性
，最后是一些常见的DOM属性:
//1.获取当前元素的父节点
var element _ father=element . parent node
//2.获取当前元素的html元素类型子节点
var element _ son=element . children
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。