jQuery 不会解析带有称为选项的节点的 xml

IT技术 javascript jquery xml
2021-02-27 21:16:54

我正在使用 jQuery 来解析一些 XML，如下所示：

function enumOptions(xml) {
   $(xml).find("animal").each(function(){  
       alert($(this).text());
   });
}

enumOptions("<root><animal>cow</animal><animal>squirrel</animal></root>");

这很好用。但是，如果我尝试查找名为“选项”的节点，则它不起作用：

function enumOptions(xml) {
   $(xml).find("option").each(function(){  
      alert($(this).text());
   });
}

enumOptions("<root><option>cow</option><option>squirrel</option></root>");

没有错误，只是没有收到警报，就好像 find 没有找到任何东西一样。它仅适用于称为选项的节点，我测试的其他所有内容都可以正常工作！

我正在使用当前版本的 jQuery - 1.4.2。

有人知道吗？

TIA。

背景

3个回答

更新

jQuery 现在内置了这个方法。您可以使用

$.parseXML("..")

从字符串构造 XML DOM。

jQuery 依赖 HTML DOMinnerHTML来解析文档，当标签名称与 HTML 中的标签名称冲突时，可能会产生不可靠的结果。

相反，您可以使用适当的 XML 解析器先解析文档，然后使用 jQuery 进行查询。下面的方法将以跨浏览器的方式解析有效的 XML 文档：

// http://www.w3schools.com/dom/dom_parser.asp
function parseXML(text) {
    var doc;

    if(window.DOMParser) {
        var parser = new DOMParser();
        doc = parser.parseFromString(text, "text/xml");
    }
    else if(window.ActiveXObject) {
        doc = new ActiveXObject("Microsoft.XMLDOM");
        doc.async = "false";
        doc.loadXML(text);
    }
    else {
        throw new Error("Cannot parse XML");
    }

    return doc;
}

一旦构建了 XML DOM，就可以正常使用 jQuery - http://jsfiddle.net/Rz7Uv/

var text = "<root><option>cow</option><option>squirrel</option></root>";
var xml = parseXML(text);
$(xml).find("option"); // selects <option>cow</option>, <option>squirrel</option>
@TimHolt - 这是一个巧妙的方法，但这个答案已经过时了。jQuery 内置了parseXML您可以使用的方法。让我更新答案。
2021-04-15 21:16:54
非常有用的答案。当我尝试将原始 XML 附加到带有$(pub.xmlDoc).find("publication > images").append("<image>foo</image>") “<image>”的文档时，我遇到了类似的问题， 并且“<image>”变成了“<img>”我所做的是使用... $(pub.xmlDoc).find("publication > images").append(DOMParser().parseFromString("<image>foo</image>","text/xml") 注意我在这里走捷径假设不是 IE（适用于该应用程序）。
2021-05-09 21:16:54

这可能是对 HTML<option>元素的一些特殊处理，但我在源代码中找不到。

+1 - 这是正确的，我<table>在 XML 中看到过同样的事情，浏览器可能会干扰任何有效的 html 元素。
2021-04-27 21:16:54

1.4.2 未缩小源代码的第 4448 行是罪魁祸首：

// ( div = a div node )
// ( elem = the xml you've passed to it )

div.innerHTML = wrap[1] + elem + wrap[2];

考虑这个代码：

var d = document.createElement('div');
d.innerHTML = "<foo><option>bar</option><b>blah</b></foo>";

alert(d.innerHTML); // <foo>bar<b>blah</b></foo>

// tested on Firefox 3.6

所以，不要问我到底为什么，但它看起来像是 DOM 处理它的方式，不一定是 jQuery 的错。

也许只是使用不同的节点名称？

也刚发现。据我所知，jQuery 本身不做任何 XML 解析——它利用“innerHTML”将字符串转换为 DOM 节点。因此，我们谈论的甚至不是 XML：它是任何您可以说服浏览器的 HTML 解析器是有效标记的东西。
2021-05-10 21:16:54
其它你可能感兴趣的问题
上一篇ES6解构对象赋值函数参数默认值 下一篇如何以正确的顺序链接映射和过滤函数