gpt4 book ai didi

JavaScript DOMParser 访问 innerHTML 和其他属性

转载 作者:行者123 更新时间:2023-12-03 13:21:02 26 4
gpt4 key购买 nike

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

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 :
doc.querySelector('body').innerHTML; // undefined
其他属性也是如此,例如 id .另一方面,属性检索很顺利 doc.querySelector('body').getAttribute('id'); .
是否有访问这些属性的神奇功能?

最佳答案

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

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 :
/* 
* 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));

关于JavaScript DOMParser 访问 innerHTML 和其他属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9250545/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com