Preface:
Creating standard DOM objects dynamically in JavaScript is generally used:
var obj = document.createelement (' div ');
Then set some properties for obj.
However, in actual use, some people might think that it would be nice to create a standard DOM object like this.
Pseudo code: Var obj=strtodom (' <div id= "div_1" class= "Div1" >hello world!</div> ");
So today's goal is to teach you how to implement a method that converts a string directly into a standard DOM object.
Start:
In fact, the implementation of such a conversion is very simple, here is the main use of a property innerhtml.
InnerHTML, I believe that we have used, especially dynamic to an element inside the use of content, here I still introduce under InnerHTML, convenient for people who are not too familiar with.
innerHTML is not the standard of the consortium, is invented by IE, but due to the convenience of this attribute, and the position of the micro-boss, other non-IE browsers also built innerHTML and gave support.
Although innerHTML is not a standard, but it is a fact standard, the fact that the standard is very important, that is, the current mainstream browser support innerHTML, naturally do a compatible multiple browsers.
Code
Copy Code code as follows:
function Parsedom (ARG) {
var obje = document.createelement ("div");
obje.innerhtml = arg;
return obje.childnodes;
};
Just a few lines of code to achieve the transformation, we first use the standard method to create a div out, in the innerHTML to insert an element, in fact, that is, using the browser's own kernel algorithm to achieve a transformation. Back out with the childnodes.
So we finished a string to the standard DOM conversion, cleverly using the browser's own algorithm, you can use a small amount of code to complete a large number of complex transformations, we do not have to parse the string, but to the browser itself to complete, so that both accurate and correct.
Use:
Copy Code code as follows:
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> multiple also doesn't matter </span> ');
Attention:
ChildNodes returns a list of similar arrays. So if it's an element, you need to use this DOM to use obj[0. If you have multiple peer Dom transformations, you can use obj[0], obj[1 ...
End
Here is the end, here to recommend a my own written JS framework, the above method is integrated in the framework of the
Use: B$.parsedom (' <div id= "div_1" class= "Div1" >hello world!</div> ")
Bbank Open source JavaScript framework
