jsp中怎么添加dom元素？ - 回车巷人才网

一、jsp中怎么添加dom元素？

可以直接在html里添加，也可以用js添加，用js添加的举例如下：

const ul=document.createElement("ul");

for(let i=1;i<=5;i++){

const li=document.createElement("li");

li.textContent=`item${i}`;

ul.append(li);

}

document.body.append(ul);

</script>

二、什么是dom0，dom1，dom2，dom3？

DOM 是用来访问或操作HTML文档、XHTML文档、XML文档中的节点元素。

现在基本上所有的浏览器都都执行了W3C发布的DOM规范，所以在浏览器上就可以用DOM的这些API。

DOM的级别Level

DOM0：不是W3C规范。

DOM1：开始是W3C规范。专注于HTML文档和XML文档。

DOM2：对DOM1增加了样式表对象模型

DOM3：对DOM2增加了内容模型 (DTD 、Schemas) 和文档验证。

三、DOM 是什么？

牢记：站高一个维度去理解问题！

为了理解DOM，我们至少需要站在浏览器的角度来思考。

DOM概念本身很简单，请先完全跟着我的思路来：

普通文档（*.txt）和HTML/XML文档（*.html/*.xml）的区别仅仅是因为后者是有组织的结构化文件；
浏览器将结构化的文档以树的数据结构读入浏览器内存，并将每个树的子节点定义为一个NODE（想象这颗树，从根节点到叶子节点都被建模为一个NODE对象）；
这每个节点（NODE）都有自己的属性（名称、类型、内容...）；
NODE之间有层级关系（parents、child、sibling...）；
以上已经完成文档的建模工作（将文档内容以树形结构写入内存），此时再编写一些方法来操作节点（属性和位置信息），即为NODE API。

抽象一下：

DOM是一种将HTML/XML文档组织成对象模型的建模过程；
DOM建模重点在于如何解析HTML/XML文档和开放符合DOM接口规范的节点操作API接口。

再抽象一下：

解析文档，建模成对象模型，开放API接口。

最后：

DOM：Document Object Model 文档对象模型

再回顾下整个过程，每个步骤都可以问自己几个问题，比如：DOM到底是建模过程，还是最后建的那个模型，还是指操作节点的API接口呢，还是...？

以上是站在浏览器的角度思考DOM，你还可以站在浏览器设计人员、网页编码人员等角度考虑：

DOM跟JavaScript什么关系？

DOM很显然诞生在浏览器，一开始是用JS实现的；
但随着DOM本身的发展，已经形成规范，你可以用任何一种语言比如Python来解析文档，生成对像树，只要满足DOM标准，包括开放标准的操作接口，那你实现的就是一个DOM。

DOM开放的接口如何操作？

JS原生接口使用。
JQuery高纬度封装如何使用。

至此，你应该明白了什么是DOM，甚至明白了为什么一开始不明白以后如何做，如何举一反三，甚至还能看出一点如何建立体系化认知的影子。笑

牢记：站高一个维度去理解问题！

四、德语中 Dom, Kathedrale和Mnster有什么区别?

Kathedrale和Dom都是主教座堂，解释和某位答主是一样的。拥有主教座的教堂，是教区最重要的教堂。这两个单词只是词源不同，Kathedrale来源于希腊语，是主教座的意思。

Dom来源于拉丁语Domus Dei，意思是天主之家。

Münster 也是源自拉丁语修道院。所以Münster是修院教堂。一般不属于上面提到的教区管理。

五、dom操作？

文档对象模型( DOM, Document Object Model )主要用于对HTML和XML文档的内容进行操作。DOM描绘了一个层次化的节点树，通过对节点进行操作，实现对文档内容的添加、删除、修改、查找等功能。

一、DOM树

DOM树有两种，分别为节点树和元素树。

节点树：把文档中所有的内容都看成树上的节点；

元素树：仅把文档中的所有标签看成树上的节点。

二、DOM常用操作

2.1 查找节点

document.getElementById('id属性值');

返回拥有指定id的第一个对象的引用

document/element.getElementsByClassName('class属性值');

返回拥有指定class的对象集合

document/element.getElementsByTagName('标签名');

返回拥有指定标签名的对象集合

document.getElementsByName('name属性值');

返回拥有指定名称的对象结合

document/element.querySelector('CSS选择器');

仅返回第一个匹配的元素

document/element.querySelectorAll('CSS选择器');

返回所有匹配的元素

document.documentElement

获取页面中的HTML标签

document.body

获取页面中的BODY标签

document.all['']

获取页面中的所有元素节点的对象集合型

2.2 新建节点

document.createElement('元素名');

创建新的元素节点

document.createAttribute('属性名');

创建新的属性节点

document.createTextNode('文本内容');

创建新的文本节点

document.createComment('注释节点');

创建新的注释节点

document.createDocumentFragment( );

创建文档片段节点

2.3 添加新节点

parent.appendChild( element/txt/comment/fragment );

向父节点的最后一个子节点后追加新节点

parent.insertBefore( newChild, existingChild );

向父节点的某个特定子节点之前插入新节点

element.setAttributeNode( attributeName );

给元素增加属性节点

element.setAttribute( attributeName, attributeValue );

给元素增加指定属性，并设定属性值

六、dom格式？

dom是app文档格式。

DOM一般指文档对象模型。文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展置标语言的标准编程接口。它是一种与平台和语言无关的应用程序接口(API),它可以动态地访问程序和脚本,更新其内容、结构和www文档的风格。

DOM是一种基于树的API文档，它要求在处理过程中整个文档都表示在存储器中。

七、dom解析？

DOM: 要求解析器将整个XML 文档装在到内存, 并解析成一个 Document 对象.

a) . 优点: 元素与元素之间保留结构关系, 故可以进行增删改查操作.

b) . 缺点: XML 文档过大, 可能出现内存溢出现象

解析器: 就是根据不同的解析方式提供的具体实现, 有的解析器操作过于繁琐, 为开发方便, 提供了易于操作的解析开发包。

八、dom词根？

dom是Document Object Model缩写，翻译过来就是文档对象模型

文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展置标语言的标准编程接口。它是一种与平台和语言无关的应用程序接口(API),它可以动态地访问程序和脚本,更新其内容、结构和www文档的风格(HTML和XML文档是通过说明部分定义的)。文档可以进一步被处理，处理的结果可以加入到当前的页面。

九、dom全称？

十、虚拟dom与真实dom的区别？

1 虚拟dom是在操作真实dom的基础上进行操作和渲染的，相较于真实dom来说更加轻量级、高效且易于维护。2 虚拟dom不需要直接操作真实dom，而是通过diff算法和批量操作等方式，将修改后的虚拟dom与之前的虚拟dom进行比对，最终仅对需要进行更新的真实dom节点进行操作，从而降低了dom操作的成本和频率。3 使用虚拟dom可以提供更加流畅的用户体验，同时也能够减轻大型web应用程序的服务器压力。4 真实dom的操作属于浏览器的原生操作，因此在某些场景下可能比虚拟dom更加高效，例如单页面应用程序中复杂交互和低延迟等操作，但同时也会带来更多的维护和优化难度。