使用 InnerHTML 解析 IMG 标签 Javascript
这是一个困境:
我正在做一个 javascript 效果。为此,我使用 .innerHTML 拉取一个节点及其子节点(包括图像)。然后尝试通过 DOM 解析它。当它到达图像标签时,它会抛出解析错误。当我警告innerHTML 时,我发现它正在剥离IMG 标签的结束。
我不确定问题是否出在解析器或innerHTML 上。我怎样才能获取这个节点,获取内部内容,并将其解析为 XML?
看起来这里发生了类似的事情:innerHTML 从图像标签中删除结束斜杠
(这是我在搜索了近两天后发现的互联网上唯一涉及此问题的页面。)
这是我正在使用的解析代码:
function loadXMLString(txt) {
if (window.DOMParser) {
parser=new DOMParser();
xmlDoc=parser.parseFromString(txt,"text/xml");
} else { // Internet Explorer
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async="false";
xmlDoc.loadXML(txt);
}
return xmlDoc;
}
解决方案是更改 mime 类型,但你如何做到这一点与javascript 解析器(MS ActiveX 和其他浏览器的标准)?我应该使用什么哑剧?
这是我试图解析的 DOM 元素:
<div style="display:none" id="ItemsContainer" name="ItemsContainer">
<SPAN>
<a href="url1"><img src="1.jpg" alt="alt1" /></a>
<a href="url2"><img src="2.jpg" alt="alt2" /></a>
<a href="url3"><img src="3.png" alt="alt3" /></a>
<a href="url4"><img src="4.jpg" alt="alt4" /></a>
</SPAN>
</div>
如果我将标签更改为另一个名称,就像这样它就可以工作。看来innerHTML正在破坏标签或者解析器无法解析IMG标签。
请指教。 提前致谢!
Here is the dilemma:
I am doing a javascript effect. To do so I am pulling a node and it's children (including images) with .innerHTML. Then trying to parse it via the DOM. When it gets to the image tags it throws a parse error. When I alert the innerHTML I see that it is stripping the closing for the IMG tags.
I am not sure if the problem is with the parser or innerHTML. How can I take this node, grab the internal contents, parse it as XML?
Looks like a similar thing happened here: innerHTML removing closing slash from image tag
(This is the only page in the internet that I found that touches on this issue after almost two Days of searching.)
Here is the parse code I am using:
function loadXMLString(txt) {
if (window.DOMParser) {
parser=new DOMParser();
xmlDoc=parser.parseFromString(txt,"text/xml");
} else { // Internet Explorer
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async="false";
xmlDoc.loadXML(txt);
}
return xmlDoc;
}
The resolution was to change the mime type, but how do you do that with the javascript parser (both MS ActiveX and the other browser's standard)? What mime should I use?
Here is the DOM Element I am attempting to parse:
<div style="display:none" id="ItemsContainer" name="ItemsContainer">
<SPAN>
<a href="url1"><img src="1.jpg" alt="alt1" /></a>
<a href="url2"><img src="2.jpg" alt="alt2" /></a>
<a href="url3"><img src="3.png" alt="alt3" /></a>
<a href="url4"><img src="4.jpg" alt="alt4" /></a>
</SPAN>
</div>
If I change the tags to another name, like then it works. It seems that innerHTML is breaking the tag or that the parser can't parse IMG tags.
Please advise.
Thanks In Advance!
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
IE 自动将标签名称大写(因此变为 ),因此我使用了 txt.replace(/><\/a>/g, " />").replace(/>< \/A>/g, " />")
感谢所有提供帮助的人!
IE automatically capitalizes Tag names (so becomes ) so I used
txt.replace(/><\/a>/g, " /></a>").replace(/><\/A>/g, " /></A>")
Thanks to all who helped!
我假设您通过使用innerHTML 获取“txt”变量?我在各种浏览器中进行了测试,它确实删除了结束标签。也许,在将其发送到函数 loadXMLString 之前,您可以使用正则表达式将它们添加回来?
I'm assuming your getting the "txt" variable by using innerHTML? I tested that in various browsers, and it does indeed strip the ending tag. Perhaps, before sending it to the function loadXMLString, you could add them back using regular expressions?