innerHTML 可以与 XML 元素一起使用吗?
Posted
技术标签:
【中文标题】innerHTML 可以与 XML 元素一起使用吗?【英文标题】:does innerHTML work with XML Elements? 【发布时间】:2011-09-04 11:34:14 【问题描述】:根据 javascript: The Definitive Guide:“尽管它的名字,innerhtml 可以与 XML 元素以及 HTML 元素一起使用”。
但是,当我实际尝试访问 XML Element 对象的 innerHTML 属性时,会返回 undefined
:
var xml = $.ajax(url: "test.xml", async: false).responseXML.documentElement;
console.log(xml.innerHTML); // displays "undefined" in console log
,这是什么行为,如何解释呢? P>
test.xml:
<?xml version="1.0" encoding="utf-8"?>
<foo><bar>baz</bar></foo>
【问题讨论】:
什么是您的响应XML的样子? SPAN> 编辑的问题包含XML响应。跨度> 【参考方案1】:较早的答案并未针对截至 2014 年 9 月存在的较新浏览器。当使用以下方式创建 XML 文档时:
var parser = new DOMParser();
var doc = parser.parseFromString(data, "text/xml");
其中data
是作为字符串的XML 文档,则以下情况为真:
在 Firefox 28 和 Chrome 36 中,doc
中的节点有一个 innerHTML
字段,其中包含节点内容的 XML 序列化。
在 IE 9、10 和 11、Safari 7.0 和 Opera 12 中,doc
中的节点既没有 innerHTML
字段也没有 xml
字段。我无法确定可以代表这些领域的东西。除了对这些浏览器使用 XMLSerializer
之外,似乎没有其他选择。
【讨论】:
这太奇怪了。我不期望一个名为innerHTML
的属性可以处理除HTMLElement
对象之外的任何东西。我想知道这是否是最新标准的预期行为?仅供参考,我回到这个问题并在回答 this question 时发现了你的答案。【参考方案2】:
解释是书在这一点上是错误的。
IE 中的 XML 元素有一个非标准的xml
属性,它提供了innerHTML
的等价物。对于其他浏览器,您需要使用XMLSerializer
。
【讨论】:
我希望不是这样(我有最新版本!)。感谢您的回复。 你会认为一本这么大的书会有一些错误,但这并不完全是一个错字,而且它是第六版,所以我有点惊讶。 @BoltClock:书籍经常出错,即使是通常优秀的 JavaScript: The Definitive Guide。我不认为我拥有一本没有任何错误的 JS 书。 我知道。那只是为了让事情变得轻松:)【参考方案3】:HTML5 在 XML 元素上定义了 innerHTML(尽管名称不同,但使用 XML 解析器/序列化器)。还没有实现这一点。 Opera 有一段时间在 XHTML 中支持 innerHTML(虽然一般不支持 XML),但它使用 HTML 解析器/序列化器。
【讨论】:
为什么 HTML5 对 XML 有话要说? 来自规范DOM Parsing and Serialization。看起来一些 HTML 泄露到了 XML 世界中。【参考方案4】:您可以这样做,但我更喜欢使用 jQuery,因为它更容易实现。 jQuery 方式是选择您想要的元素容器。然后,您可以使用 html() 属性来更改或获取元素的 innerHTML。
$("myxmltag").html("<achildtag>Hello</achildtag><anotherchildtag>World!</anotherchildtag>");
有关此属性的更多信息,请参阅:http://api.jquery.com/html/
另外,不要忘记 html() 和 text() 之间的区别,您可以使用 jQuery 使用其他属性来操作 xml 中节点内的元素,例如 append()、prepend()、after( ) 等...
【讨论】:
jQuery 的 html() 文档明确指出该方法不适用于 XML 文档。 我不知道为什么,但它对我有用。好吧,我认为这是因为我手动创建了 xml,我的意思是,我没有从服务器获取它。以上是关于innerHTML 可以与 XML 元素一起使用吗?的主要内容,如果未能解决你的问题,请参考以下文章
JavaScript中,可以用元素的innerHTML直接添加子元素吗?