Question

我必须查询XML标记的内容，并匹配具有相同ID的所有父节点，然后在页面上显示结果。

伪代码：

加载XML文件
从用户那里获取输入（var inputTerm）
在XML标签<term>中找到inputTerm
获取父节点<entry>的ID
在inputTerm中找到所有具有相同ID的入口节点
显示这些条目的所有子节点

我进入了伪代码的第4步，但不知道如何继续。我必须再次遍历XML文件，以查找具有相同ID的所有条目标签。

XML：

<terms>
    <entry ID="1">
        <language>en</language>
        <term>user</term>
        <state>text</state>
        <use>text</use>
        <definition>text</definition>
        <definition-source>text</definition-source>
        <source>text</source>
        <circle>text</circle>
    </entry>
    <entry ID="1">
        <language>de</language>
        <term>user1</term>
        <state>text</state>
        <use>text</use>
        <definition>text</definition>
        <definition-source>text</definition-source>
        <source>text</source>
        <circle>text</circle>
    </entry>
    <entry ID="2">[...]</entry>
    [...]
</term>

jQuery：

$.ajax({
  type: "GET" ,
  url: "assets/db/export.xml" ,
  dataType: "xml" ,
  success: function(xml) {

    $('entry', xml).each(function() {
      var $entry = $(this)
      var xterm = $entry.find("term").text();

      $('#submit').click(function() {
        // get input from user
        var inputTerm = $('#find-term').val();
        // match user input and XML content
        if (inputTerm === xterm) {
          // get ID from matching term
          var matchingID = $entry.attr('ID');
          console.log(matchingID);
          // How to go on here?
          var language = $entry.find("language").text();
          var term = $entry.find("term").text();
          var state = $entry.find("state").text();
          var use = $entry.find("use").text();
          var definition = $entry.find("definition").text();
          var definitionSource = $entry.find("definition-source").text();
          var source = $entry.find("source").text();
          var circle = $entry.find("circle").text();
          // show results
          $('.values').append('<li>' + language + '</li>');
          $('.term').append('<li>' + term + '</li>');
          $('.state').append('<li>' + state + '</li>');
          $('.usage').append('<li>' + use + '</li>');
          $('.definition').append('<li>' + definition + '</li>');
          $('.definition-source').append('<li>' + definitionSource + '</li>');
          $('.source').append('<li>' + source + '</li>');
          $('.circle').append('<li>' + circle + '</li>');
        }
        else {
          console.log("No entry found.");
        }
      });
    })
  }     
});

是否可以每秒钟添加一秒，以及如何匹配具有相同ID的所有条目？

Answer 1

这就是我要做的：

加载XML文件
完成后，启用“提交”按钮（最初保持禁用状态）

在XML文档中搜索匹配字词
提取与匹配项相关的ID属性的值
根据这些ID过滤XML条目
将找到的结果添加到页面

我假设您要支持不区分大小写的术语搜索，因此我提供了一个帮助程序：

// helper for jQuery.fn.filter
function containsCaseInsensitive(searchTerm) {
    return function () {
        return $(this).text().toUpperCase().includes(searchTerm.toUpperCase());
    };
}

$.get("assets/db/export.xml").done(function (exportXml) {
    var $exportXml = $(exportXml);

    // enable button and attach event handler after download is done
    $('#submit').prop("disabled", false).click(function() {
        var searchTerm = $('#find-term').val();
        var $terms = $exportXml.find("term").filter(containsCaseInsensitive(searchTerm));
        var ids = $terms.map(function () { return $(this).parent().attr("ID"); }).toArray();
        var $entries = $exportXml.find("entry").filter(function () { return ids.includes( $(this).attr("ID") ); });

        // don't forget to empty out the search result display

        if (!$entries.length) alert("No entry found.");

        $entries.each(function () {
            var $entry = $(this);
            $("<li>", {text: $entry.children("language").text()}).appendTo(".values");
            $("<li>", {text: $entry.children("term").text()}).appendTo(".term");
            $("<li>", {text: $entry.children("state").text()}).appendTo(".state");
            $("<li>", {text: $entry.children("use").text()}).appendTo(".usage");
            $("<li>", {text: $entry.children("definition").text()}).appendTo(".definition");
            $("<li>", {text: $entry.children("definition-source").text()}).appendTo(".definition-source");
            $("<li>", {text: $entry.children("source").text()}).appendTo(".source");
            $("<li>", {text: $entry.children("circle").text()}).appendTo(".circle");
        });
    });
});

如何查找具有相同属性值的所有xml节点

1 个答案: