Question

我有这个代码，用于根据孩子的属性从xml列表中删除不需要的项目。

var xmlDoc=loadXMLDoc(filePath);

var unwanted = xmlDoc.querySelectorAll("item > KlasId[id='1']");
Array.prototype.map.call(unwanted, function(element){
    element.parentNode.parentNode.removeChild(element.parentNode);
});

此工作正常，并移除item个KlasId个id=1个子节点的所有item个节点。

我现在想要的是根据KlasId 值而不是属性（例如值101010）删除var unwanted = xmlDoc.querySelectorAll("item > KlasId[value='101010']"); etc...，但它不知何故不起作用：

<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<dataroot>
<item>
<KlasId id='1'>101010</KlasId>
</item>

<item>
<KlasId id='2'>101010</KlasId>
</item>

<item>
<KlasId id='3'>202020</KlasId>
</item>
</dataroot>

我的XML：

function loadXMLDoc(filename)
{
if (window.XMLHttpRequest)
  {
  xhttp=new XMLHttpRequest();
  }
else // code for IE5 and IE6
  {
  xhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xhttp.open("GET",filename,false);
xhttp.send();
return xhttp.responseXML;
}

修改

{{1}}

Answer 1

如果您只使用Chrome（或Firefox，Opera或Safari），则可以使用XPath执行此选择：

var found = xmlDoc.evaluate("/*/item[KlasId = '101010']", xmlDoc);

这将返回一个节点迭代器，您可以使用它来按照here所述迭代节点。

function getNodes(iterator) {
    var nodes = [],
        next = iterator.iterateNext();

    while (next) {
        nodes.push(next);
        next = iterator.iterateNext();
    }
    return nodes;
}

getNodes(found).forEach(function (node) {
    node.parentNode.removeChild(node);
});

＆＃13;

var xmlDoc = $.parseXML("<dataroot><item><KlasId id='1'>101010</KlasId></item><item><KlasId id='2'>101010</KlasId></item><item><KlasId id='3'>202020</KlasId></item></dataroot>");

var found = xmlDoc.evaluate("//item[KlasId = '101010']", xmlDoc);

function getNodes(iterator) {
    var nodes = [],
        next = iterator.iterateNext();

    while (next) {
        nodes.push(next);
        next = iterator.iterateNext();
    }
    return nodes;
}

getNodes(found).forEach(function (node) {
    console.log('Removing node.');
    node.parentNode.removeChild(node);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>

＆＃13;

Internet Explorer不支持.evaluate()（或据我所知，任何XPath功能），因此如果您需要跨浏览器支持，我认为您需要使用第三方库。我推荐xpath.js，我是其中的贡献者。

还有一个选择是使用jQuery的扩展CSS选择器来执行选择：

var $nodes = $(xmlDoc).find('item > KlasId:contains("101010")');

$nodes.remove();

＆＃13;

var xmlDoc = $.parseXML("<dataroot><item><KlasId id='1'>101010</KlasId></item><item><KlasId id='2'>101010</KlasId></item><item><KlasId id='3'>202020</KlasId></item></dataroot>");

var $nodes = $(xmlDoc).find('item > KlasId:contains("101010")');

console.log($nodes.length);

$nodes.remove();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

＆＃13;

这也是一个跨浏览器的解决方案，但它会根据包含比较而不是相等比较来选择元素。

不相关的旁注：.map()用于将一个阵列投射到另一个阵列上。要执行一系列副作用，请使用.forEach()。

Answer 2

您不能仅使用CSS，因为没有CSS选择器可以通过元素的值进行选择。请参阅此博文：Blog

XML：按它的值而不是属性选择节点

2 个答案: