preface:

Browser support for XPath... XML was once the standard for storing and transmitting structured data on the Internet. The development of XML reflects the development of the Web because
The DOM standard is intended not only for use in browsers, but also for processing XML data structures in desktop and server applications. stay
When there is no DOM standard, many developers use JavaScript to write their own XML parsers. Since the DOM standard came into being
Some browsers are beginning to support XML, XML DOM and many other related technologies natively.

1 browser support for XML DOM

Because many browsers began to implement XML parsing schemes before the formal standard came out, different browsers do not support the standard
There are only differences in level and implementation. DOM Level 3 adds parsing and serialization capabilities. However, in DOM Level 3
When the formulation is completed, most browsers have also implemented their own parsing scheme.

1.1 DOM Level 2 Core

You can create an empty XML document as follows:

let xmldom = document.implementation.createDocument(namespaceUri, root, doctype);  

When processing XML in JavaScript, the root parameter is usually used only once because it defines the XML DOM
The tag name of the document element in. The namespaceUri parameter is rarely used because it is difficult to manage namespaces in JavaScript.
The doctype parameter is less used.
To create a new XML document with the document object tag name, you can use the following code:

let xmldom = document.implementation.createDocument("", "root", null);  
console.log(xmldom.documentElement.tagName); // "root"  
let child = xmldom.createElement("child");  
xmldom.documentElement.appendChild(child);  

This example creates an XML DOM document that has no default namespace and document type. Note that even if not specified

Namespace and document type, parameters still need to be passed. Namespace. An empty string indicates that the namespace is not applied, and the document type is passed in
null indicates that there is no document type. The xmldom variable contains instances of DOM Level 2 Document type, including. 1 browser support for XML DOM introduced in Chapter 12 695
All DOM methods and properties. In this example, we print the tag name of the document element, and then create and add it
A new child element was created.
To check whether the browser supports DOM Level 2 XML, you can use the following code:

let hasXmlDom = document.implementation.hasFeature("XML", "2.0");  

In practice, it is rarely necessary to create XML documents out of thin air, and then use DOM method to systematically create XML data structures. More
The XML document is parsed into a DOM structure, or vice versa. Because DOM Level 2 does not provide this function, some de facto standards have emerged.

1.2 DOMParser type

Firefox added the DOMParser type specifically for parsing XML into DOM documents, which was later implemented by all other browsers
Type. To use DOMParser, you need to create an instance of it before calling the parseFromString() method. This side
Method takes two parameters: the XML string to parse and the content type (always "text/html"). The return value is Document
Examples of. Consider the following example:

let parser = new DOMParser();  
let xmldom = parser.parseFromString("<root><child/></root>", "text/xml");  
console.log(xmldom.documentElement.tagName); // "root"  
console.log(xmldom.documentElement.firstChild.tagName); // "child"  
let anotherChild = xmldom.createElement("child");  
xmldom.documentElement.appendChild(anotherChild);  
let children = xmldom.getElementsByTagName("child");  
console.log(children.length); // 2

This example parses a simple XML string into a DOM document. The resulting DOM structure is a document element,
It has child elements. You can then interact with the returned document using DOM methods.
DOMParser can only parse well formed XML, so it can't parse HTML into HTML documents. When a parsing error occurs,
Different browsers behave differently. parseFromString() when parsing errors occur in Firefox, Opera, Safari and Chrome
Method will still return a document object, but its document element is, and the content of the element is solution
Analyze the description of the error. The following is an example of a parsing error:

<parsererror xmlns="http://www.mozilla.org/newlayout/xml/parsererror.xml">XML  
Parsing Error: no element found Location: file:// /I:/My%20Writing/My%20Books/  
Professional%20JavaScript/Second%20Edition/Examples/Ch15/DOMParserExample2.js Line  
Number 1, Column 7:<sourcetext><root> ------^</sourcetext></parsererror>  

Both Firefox and Opera return documents in this format. The documents returned by Safari and Chrome will include elements
Embedded in the location where the parsing error occurred. Earlier IE versions threw parsing errors where parseFromString() was called. because
For these differences, it is best to use try/catch to judge whether there are parsing errors. If there are no errors, use getElements
The ByTagName() method finds whether the document contains elements, as shown below:

let parser = new DOMParser(),  
 xmldom,  
 errors;  
try {  
 xmldom = parser.parseFromString("<root>", "text/xml");  
 errors = xmldom.getElementsByTagName("parsererror");  
 if (errors.length > 0) { 
 throw new Error("Parsing error!");  
 }  
} catch (ex) {  
 console.log("Parsing error!");  
}  

The XML string parsed in this example is less than one label, so it will cause parsing errors. IE will throw an error at this time.
Firefox and Opera will now return the document with the document element, while Chrome and Safari will return the document
File is the first child element of the. Call getElementsByTagName("parserror")
It can be applied to the latter two cases. If the method returns any element, it indicates an error and a warning box will pop up to give a prompt. Of course, at this time
The error message can be further parsed and displayed.

1.3 XMLSerializer type

In contrast to DOMParser, Firefox also adds an XML serializer type to provide the opposite function: DOM documents
Serialize to an XML string. Since then, XML serializer has also been supported by all mainstream browsers.
To serialize a DOM document, you must create a new instance of XMLSerializer and pass the document to serializeToString()
Method, as follows:

let serializer = new XMLSerializer();  
let xml = serializer.serializeToString(xmldom);  
console.log(xml);  

The value returned by the serializeToString() method is a string that does not print well, so it looks a little difficult to the naked eye.
XML serializer can serialize any valid DOM object, including individual nodes and HTML documents. Putting HTML text
When the file is passed to serializeToString(), the document will be treated as an XML document, so the result is well formed.
Note that if you pass in a non DOM object to serializeToString(), an error will be thrown.

summary

That's what we're talking about today JavaScript Advanced programming (III) browser pair XML DOM Support of
 Will continue to update
 It's not easy to be original. We look forward to your praise, attention and forwarding comments😜😜