包含dom序列化html的词条
如何通过一段HTML代码生成DOM对象
var create_dom = function(html){
var empty = new Element('div', {'html':html});
var el = empty.getFirst();
return el;
};
怎么对从后台获取回来的html代码进行dom操作
那就 得用js 获取到后台给的html 然后再通过 动态构建 dom结构的方式来使用这些html 比如 后台返回的html是:"h1hah/h1div..../div"
var str="h1hah/h1div..../div"
那就 找到你想要放的地址 id,比如是 test 那就是 $("#test").append(str) 然后就可以 了
关于HTML DOM的问题
这样理解是不对的，id不是节点，是li的一个attribute，2才是它的一个节点，节点类型是nodeText~
检测代码如下：
html
head
script type="text/javascript"
function searchDOM()
{
var oli=document.getElementById("tgc");
//alert(oli.tagName+" "+oli.childNodes[0].nodeValue)
var tgcAtt = oli.getAttribute("id");
alert("oli的nodeType为:"+oli.nodeType+" id的nodeType="+oli.attributes["id"].nodeType);
var nameArr = new Array();
for(var name in oli){
nameArr.push(name+"!! type="+name.nodeType);
}
//alert(nameArr.join(' '));
var childNodes = oli.childNodes;
for(var i=0;ichildNodes.length;i++){
// alert("子结点【"+i+"】："+childNodes[i].outerHTML);
}
}
/script
/head
body
ul
li1/li
li id="tgc" ffffffffffffff='aaaa' ggggggggggggg='sadfsafd'
div id="div1"
div1
/div
div id="div2"
div2
/div
div id="div3"
div3
/div
/li
/ul
input onclick="searchDOM()" type="button" value="test"/
/body
/html
Taro 3.3 alpha 发布：用 ant-design 开发小程序？
小程序的设计并没有完全遵循 Web 规范，导致小程序生态和传统 Web 开发生态之间的割裂，海量优秀的 Web 物料并不能直接用于小程序开发。因而 Taro 在相当一段时间内生态都相对薄弱，UI 框架选择不多的问题更是深深困扰着开发者。
另一方面，业界有着存量的 H5 应用，中短期内 H5 应用适配到小程序端的需要还会存在。我们希望能减少 H5 应用迁移到小程序端的成本，甚至能够直接运行在小程序端。
Taro 团队一直在思考如何最大限度地在小程序环境中复用 Web 生态，直到 Taro 3.0 诞生后，这种想法有了落地的可能。下文将介绍基于 Taro 3.0 实现 H5 同构的思路与问题，以及我们尝试适配了三大移动端 UI 框架 WEUI 、 Ant Design Mobile 、 VantUI 的实验结果。
Taro 3.0 是一款重运行时的跨端框架，它通过模拟实现浏览器的 BOM 和 DOM API 实现了对 React、Vue 等 Web 开发框架的兼容。
既然已经有了浏览器环境的 BOM 和 DOM API，Taro 应用和 Web 应用之间的鸿沟在于小程序组件和 HTML 标签之间的差异。
Taro3 的渲染数据流如下：
前端框架 - Taro DOM - 小程序 data
HTML 标签和小程序组件的标签名、属性、事件是有差异的，而前端框架无需感知这些差异。
因此前端框架适配层、Taro DOM 层不需要改动，只要在 Taro DOM 序列化为小程序 data 这一步作映射即可。
HTML 标签相对小程序组件封装程度更低、功能更简单，可以看作是小程序组件的子集。因此可以按一定的规则，把 HTML 标签映射为小程序组件，如：
完整的标签名映射规则请看： RFC 附录一
如果 HTML 标签的属性能在对应小程序组件的属性上找到对应，则进行映射，如：
完整的属性名映射规则请看： RFC 附录二
把 HTML 特有的事件在小程序端找到相似的事件进行映射，如：
完整的事件映射规则请看： RFC 附录三
前文介绍了我们会把 HTML 标签映射为小程序组件，但是 H5 应用中使用到的 CSS 标签选择器就会失效。
因此 Taro 使用了类名去进行模拟：
Taro 提供两种内置的浏览器默认样式，可以直接引入生效：
理想很美好，但现实却略显骨感。即使 Taro 能实现 BOM、DOM API，支持使用 HTML 标签等，同构方案还是存在着一些框架层面抹平不了的差异。以下列举出若干主要限制：
在 H5 中我们可以调用 DOM API 同步获取元素的尺寸：
但是在小程序中，获取元素尺寸的 API 是异步的：
因此不能兼容那些使用了同步 DOM API 去获取元素尺寸的组件。
canvas 、 video 、 audio 等标签在 H5 端可以直接调用 HTMLElement 上的方法：
但是在 Taro 中，要调用组件上的原生方法，必须先创建对应的 Context ：
部分样式或 CSS 选择器在小程序中不支持，如：
首先需要安装 v3.3 的 CLI 工具：
然后进入项目，把 package.json 文件中 taro 相关依赖的版本修改为 ^3.3.0-alpha.2 ，再重新安装依赖（建议先把 node_modules 文件夹删除）。
为了节省项目空间，同构功能是可选的，以 Taro 插件的形式提供。
首先开发者需要安装插件 @tarojs/plugin-html ：
然后配置使用此插件：
为了验证同构功能的可用性和效果，我们对 CSS 样式库 WEUI 、React 组件库 Antd Design Mobile 、Vue2 组件库 VantUI 的所有组件进行了测试。
测试效果比较理想，甚至稍微超出我们的预期，配合各组件库自身的按需加载能力，能以小巧的体积使用丰富的组件，相信各位开发者会喜欢这个功能。
仓库地址： taro-weui
WEUI 是一个 CSS 的样式库，与框架无关，兼容性比较高，大部分组件能直接使用。
仓库地址： taro-antd-mobile
能直接兼容使用的组件大概为 80%，主要问题在于：
仓库地址： taro-vant
VantUI 的组件十分丰富，能直接兼容使用的组件大概为 70%。部分开发者会在 Taro 中配合使用 Vant Weapp，但 Vant Weapp 只能运行在微信小程序，因此对 VantUI 的直接适配是一个很好的补充。
适配过程主要遇到的问题有：
同构方案还在持续优化中，部分实现还没有最终定稿。欢迎各位开发者到我们的论坛下留言，提出您的宝贵意见～： 同构方案 RFC 。
欢迎关注凹凸实验室
浏览器是怎么把html文档解析成DOM结构的
浏览器解析html的过程如下：
HTML解析器的工作是解析HTML标记到解析树
1)HTML语法定义
HTML的词汇与句法定义在w3c组织创建的规范中。当前版本是HTML4，HTML5的工作正在进行中。
2)不是上下文无关语法
在对解析器的介绍中看到，语法可以用类似BNF的格式规范地定义。不幸的是所有常规解析器的讨论都不适用于HTML（我提及它们并不是为了娱乐，它们可以用于解析CSS和JavaScript）。HTML无法用解析器所需的上下文无关的语法来定义。过去HTML格式规范由DTD (Document Type Definition)来定义，但它不是一个上下文无关语法。
HTML与XML相当接近。XML有许多可用的解析器。HTML还有一个XML变种叫XHTML，那么它们主要区别在哪里呢？区别在于HTML应用更加”宽容”，它容许你漏掉一些开始或结束标签等。它整个是一个“软”句法，不像XML那样严格死板。 总的来说这一看似细微的差别造成了两个不同的世界。一方面这使得HTML很流行，因为它包容你的错误，使网页作者的生活变得轻松。另一方面，它使编写语法格式变得困难。所以综合来说，HTML解析并不简单，现成的上下文相关解析器搞不定，XML解析器也不行。
3)HTML DTD
HTML的定义使用DTD文件。这种格式用来定义SGML族语言，它包含对所有允许的元素的定义，包括它们的属性和层级关系。如我们前面所说，HTML DTD构不成上下文无关语法。
DTD有几种不同类型。严格模式完全尊守规范，但其它模式为了向前兼容可能包含对早期浏览器所用标签的支持。当前的严格模式DTD：
4)DOM
解析器输出的树是由DOM元素和属性节点组成的。DOM的全称为：Document Object Model。它是HTML文档的对象化描述，也是HTML元素与外界（如Javascript）的接口。
DOM与标签有着几乎一一对应的关系，如下：
html
body
phello world/p
divimg src="aa.png"//div
/body
/html
dom是什么
DOM一般指文档对象模型。
文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展置标语言的标准编程接口。它是一种与平台和语言无关的应用程序接口(API)，它可以动态地访问程序和脚本，更新其内容、结构和www文档的风格(HTML和XML文档是通过说明部分定义的)。
特征：
DOM分为HTML DOM和XML DOM两种。它们分别定义了访问和操作HTML/XML文档的标准方法，并将对应的文档呈现为带有元素、属性和文本的树结构（节点树）。
1、DOM树定义了HTML/XML文档的逻辑结构，给出了一种应用程序访问和处理XML文档的方法。
2、在DOM树中，有一个根节点，所有其他的节点都是根节点的后代。
3、在应用过程中，基于DOM的HTML/XML分析器将一个HTML/XML文档转换成一棵DOM树，应用程序通过对DOM树的操作，来实现对HTML/XML文档数据的操作。