首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >JavaScript DOMParser access innerHTML和其他属性

JavaScript DOMParser access innerHTML和其他属性
EN

Stack Overflow用户
提问于 2012-02-13 00:43:46
回答 3查看 47.4K关注 0票数 28

我使用以下代码将字符串解析为DOM:

代码语言:javascript
复制
var doc = new DOMParser().parseFromString(string, 'text/xml');

其中,string类似于<!DOCTYPE html><html><head></head><body>content</body></html>

typeof doc给了我object如果我执行类似doc.querySelector('body')的操作,我会得到一个DOM对象。但是,如果我尝试访问任何属性,就像您通常所能做的那样,它会显示undefined

代码语言:javascript
复制
doc.querySelector('body').innerHTML; // undefined

其他属性也是如此,例如id。另一方面,属性检索进行得很好,doc.querySelector('body').getAttribute('id');

有没有一个神奇的函数可以访问这些属性?

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2012-02-13 01:50:28

当前方法失败,因为没有为给定的XML文档定义HTML属性。如果您提供了text/html MIME类型,则该方法应该可以工作。

代码语言:javascript
复制
var string = '<!DOCTYPE html><html><head></head><body>content</body></html>';
var doc = new DOMParser().parseFromString(string, 'text/html');
doc.body.innerHTML; // or doc.querySelector('body').innerHTML
// ^ Returns "content"

下面的代码为浏览器启用了text/html MIME类型,这些浏览器本身还不支持它。是从Mozilla Developer Network检索的

代码语言:javascript
复制
/* 
 * DOMParser HTML extension 
 * 2012-02-02 
 * 
 * By Eli Grey, http://eligrey.com 
 * Public domain. 
 * NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK. 
 */  

/*! @source https://gist.github.com/1129031 */  
/*global document, DOMParser*/  

(function(DOMParser) {  
    "use strict";  
    var DOMParser_proto = DOMParser.prototype  
      , real_parseFromString = DOMParser_proto.parseFromString;

    // Firefox/Opera/IE throw errors on unsupported types  
    try {  
        // WebKit returns null on unsupported types  
        if ((new DOMParser).parseFromString("", "text/html")) {  
            // text/html parsing is natively supported  
            return;  
        }  
    } catch (ex) {}  

    DOMParser_proto.parseFromString = function(markup, type) {  
        if (/^\s*text\/html\s*(?:;|$)/i.test(type)) {  
            var doc = document.implementation.createHTMLDocument("")
              , doc_elt = doc.documentElement
              , first_elt;

            doc_elt.innerHTML = markup;
            first_elt = doc_elt.firstElementChild;

            if (doc_elt.childElementCount === 1
                && first_elt.localName.toLowerCase() === "html") {  
                doc.replaceChild(first_elt, doc_elt);  
            }  

            return doc;  
        } else {  
            return real_parseFromString.apply(this, arguments);  
        }  
    };  
}(DOMParser));
票数 49
EN

Stack Overflow用户

发布于 2019-07-17 21:20:25

尝试如下所示:

代码语言:javascript
复制
const fragment = document.createRange().createContextualFragment(html);

而html是您想要转换的字符串。

票数 3
EN

Stack Overflow用户

发布于 2017-03-06 01:44:54

对XML/HTML元素使用element.getAttribute(attributeName)

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/9250545

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档