Question

我目前正在创建一个在线词典。

我有一个XML文档，其中包含来自Dictionary的信息，如下所示：

<?xml version="1.0" encoding="UTF-8"?>
<dictionary>
    <norman>
        <entry>A 1. the male or positive principle, yang 2. convex, raised 3.interjection ofresponse 4. interjection of fear S. vocative particle 6. a tooth in the Manchuscript A A an interjection of casual response </entry>
        <entry>A I BUKDAN the outside edge of a piece of folded paper </entry>
        <entry>A JIJUN I ACANGGA a bronze identification token with raised characters used togain admittance to a city at night </entry>
        <entry>A JILGAN a yang tone in music A FA SERE ONGGOLO see afanggala </entry>
        <entry>A SI a sound used for driving chickens or birds </entry>
        <entry>A TA (onom.) the sound of a commotion ABA 1. hunt, battue 2. where 
    </norman>
</dictionary>

我的HTML看起来像这样：

<input type="text" name="entry" id="input">
<br />
<input type="submit" value="Submit" onClick="searchXML()">
<br />
<br />
<div id="results">
</div>

我希望用户能够搜索像“JIJUN”这样的单词，然后返回包含该单词的每个条目（整行）并显示在“结果”DIV中

我的主要问题是我不知道如何使用javascript实现这一点，向正确的方向推进将非常有帮助，一个完整的答案将是非常棒的。我在堆栈交换中使用了其他示例，但没有一点帮助。

谢谢

Answer 1

如果文件非常大，无论如何都会很慢，因为你在本质上搜索大字符串中的文本。更新：看到它是23k行文件的注释，这可能是几兆字节所以期望用户第一次加载缓慢。

您可以将XML加载到字符串中，然后找到搜索词的第一个实例，调用函数将该条目追加到结果DIV中。然后从您刚刚识别的条目的末尾开始，或者如果您在搜索词结束后从角色中懒惰，请再次运行搜索。

要追加的功能只会从<entry>的搜索词匹配（字符串中的字符偏移索引位置）向后搜索，然后转发到字符串</entry>。

要对这两个函数进行编码，您主要需要字符串函数indexOf。

jsFiddle solution here

不确定原因，但解决方案在JSFiddle上发现错误，它无法找到searchXML函数。将它保存到.html文件并在浏览器中打开时，它可以正常工作。

*注意：我删除了XML文件中的换行符以快速模拟示例，您可以将XML加载到字符串this way中。

<强> HTML

<body>
<input id="srch" type="text" >
<br />
<input  type="submit" value="Submit" onClick="searchXML()">
<br />
<br />
<div id="results">
</div>
</body>

<强> JS

var dict = '<?xml version="1.0" encoding="UTF-8"?><dictionary>    <norman>        <entry>A 1. the male or positive principle, yang 2. convex, raised 3.interjection ofresponse 4. interjection of fear S. vocative particle 6. a tooth in the Manchuscript A A an interjection of casual response </entry>        <entry>A I BUKDAN the outside edge of a piece of folded paper </entry>        <entry>A JIJUN I ACANGGA a bronze identification token with raised characters used togain admittance to a city at night </entry>        <entry>A JILGAN a yang tone in music A FA SERE ONGGOLO see afanggala </entry>        <entry>A SI a sound used for driving chickens or birds </entry>        <entry>A TA (onom.) the sound of a commotion ABA 1. hunt, battue 2. where     </norman></dictionary>';
//NOTE: if your XML contains any ' characters it will break.. search replace your dictionary for the ' character first replace it with " maybe, this is the fastest solution to this, ok if your dictionary is not dynamic

function searchXML() {

  var term = document.getElementById('srch').value;

  getNextEntry(term, 0, dict.length-1);
}

function getNextEntry(term, startIndexPos, endIndexPos){

    var n = dict.indexOf(term, startIndexPos,endIndexPos);
    if (n > 0) {
        //found hit
        addHitToDIV(n);
        getNextEntry(term, n + term.length + 1, endIndexPos);

    } else {
        //done searching

        return -1;
     }


}
function addHitToDIV(startIndexPos) {
    var fullEntry;
    var first = dict.lastIndexOf("<entry>", startIndexPos);
    var last = dict.indexOf("</entry>", startIndexPos,dict.length-1);
    document.getElementById('results').innerHTML = document.getElementById('results').innerHTML + "<p>" + dict.substring(first+7, last-1) + "</p><br>";
}

使用Javascript从XML文件

1 个答案: