前言:
在javascript里面动态创建标准dom对象一般使用:
var obj = document.createElement('div');
然后再给obj设置一些属性。
但是,在实际使用过程中,有些人可能会想,要是能这样创建标准的dom对象就好了
伪代码:var obj=strToDom('<div id="div_1" class="div1">Hello World!</div>');
那么今天的目的就是教大家怎么去实现一个这样的方法用来把字符串直接转换为标准的dom对象
start:
其实实现这样的一个转换是很简单的,这里主要是利用了一个属性innerHTML.
innerHTML,我相信大家都使用过,特别是动态往一个元素里面插内容时使用,这里我还是在介绍下innerHTML,方便于还不太熟悉的人。
innerHTML不是w3c标准,是由ie发明创造出来的,但是由于这个属性的方便性,和当时微老大的地位,其它非ie浏览器也内置了innerHTML并给出了支持。
虽然innerHTML不是w3c标准,但是却是一个事实标准,这个事实标准很重要,也就是目前主流浏览器都支持innerHTML,自然就做到了兼容多浏览器。
code:
function parseDom(arg) {
var objE = document.createElement("div");
objE.innerHTML = arg;
return objE.childNodes;
};
短短几行代码就实现了转换,我们首先用标准的方法创建一个div出来,在用innerHTML来插入一个元素,其实也就是利用浏览器自己的内核算法来实现的一个转换。在用childNodes返回出来。
这样我们就完成了一个字符串到标准dom的转换,巧妙的利用浏览器本身的算法,可以用简单少量的代码来完成大量复杂的转换,我们不用去解析字符串,而是交给浏览器自己来完成,这样既准确又无误。
使用:
var obj=parseDom('<div id="div_1" class="div1">Hello World!</div>');
var obj=parseDom('<div id="div_1" class="div1">Hello World!</div><span>多个也没关系</span>');
注意:
childNodes返回的是一个类似数组的list。所以如果是一个元素,要使用这个dom需要这样使用obj[0]。如果是多个同级的dom转换,可以这样使用obj[0]、obj[1]…
dom 转字符串更简单,可以使用三方类库实现
jquery 中提供的有dom 转字符串的方法 var domStr= $("#").html();
转换原理大家可以参考一下源代码,估计应该是采用深度遍历的方式返回拼接字符串
end
到这里就结束了,在这里向大家推荐一个我自己写的js框架,上面的这个方法集成在框架里面了
使用:b$.parseDom('<div id="div_1" class="div1">Hello World!</div>')
相关推荐
javascript转换字符串为dom对象(字符串动态创建dom).docx
那么今天的目的就是教大家怎么去实现一个这样的方法用来把字符串直接转换为标准的dom对象
dom4j解析字符串
// 下面的是通过解析xml字符串的 doc = DocumentHelper.parseText(xml); // 将字符串转为XML Element rootElt = doc.getRootElement(); // 获取根节点 System.out.println("根节点:"+ rootElt.getName()); // ...
dom4j解析xml字符串实例
NULL 博文链接:https://yangyongbyjava.iteye.com/blog/2068636
将对象(java bean)转换为xml字符串
Dom4jDemo字符串转xml,通过dom4j解析xml demo
1.场景描述 如上接口中,content字段: content:这是内容 需要在网页中现实如下效果: 2.解决方法 v-html v-html可以操作元素中的HTML标签,效果类似于jquery里的 .html()方法,在不安全的页面比如注册或者...
下面小编就为大家带来一篇基于jQuery对象和DOM对象和字符串之间的转化实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
绝望虚拟化 用于将字符串和DOM节点转换为与兼容的虚拟DOM节点的。原料药virtualize(nodes, options) nodes: Element|String String-一个DOM Element或一串HTML可以变成一组虚拟DOM节点。 options: Object -传递给...
将xml写成字符串的形式,采用dom4j进行解析,一个简单的例子
数组方法,date对象,bom,dom以及事件等的相关知识笔记。。。。。自己看视频总结的,特别基础的部分,初级JS。
javascript中,不论是解析xml文件,还是xml格式的字符串,都是通过DOM对象来进行操作的。希望本文档会给有需要的朋友带来帮助;感兴趣的朋友可以过来看看 资源截图: 资源太大,传百度网盘了,链接...
vdom-to-html, 将虚拟DOM节点转换为 HTML vdom-to-html 将虚拟dom节点转换为 HTML安装npm install --save vdom-to-html用法var VNode = require('virtual-dom
WebService在传递数据的时候只能传递字符串,当我们返回一些简单的字符串时我们可以直接返回,但是当我们想返回比如List,Map等复杂类型的数据时拼接字符串就是个很麻烦的工作,这时我们就用到了dom4j这个工具。
NULL 博文链接:https://dreams75.iteye.com/blog/512319
1、使用Document和Xpath进行对字符串进行操作 2、前端页面做锚点的效果 3、使用Xpath语法进行对字符串的做处理 4、富文本的字符串保存做二次的编辑 需求: 截取<p></p>里面的文字,并且找对应的文字进行匹配,如...