搜索xml文件以查找搜索字符串中的任何匹配项

时间:2014-02-18 10:15:55

标签: javascript html xml dom

当searchterm是关键字之一(例如'driver'或'white)时,它会给出结果并且似乎没问题,但是当searchterm扩展到'driver 102'或'R-22 red'时,没有任何反应。

(使用RegEx表达式,转义空格,尝试在searchterm上循环 - 它遍历每个字母)

关于如何从searchterm中的多个单词获得结果的任何想法?(例如'driver 102'或'R-22 red')

     *xml doc:*

 <searchable_index>
   <Search>
     <title>driver</title>
     <keyword>101 101</keyword>
     <link>R-12</link>
     <color>white</color>
     <itemid>test</itemid>
   </Search>
   <Search>
    <title>driver</title>
    <keyword>102</keyword>
    <link>R-22</link>
    <color>red</color>
    <itemid>1test</itemid>
   </Search>
  </searchable_index>

    *Javascript:*

    function loadIndex() {

          if (document.implementation && document.implementation.createDocument) {
          xmlDoc = document.implementation.createDocument("", "", null);
         xmlDoc.load("index9.xml");

          }

           else if (window.ActiveXObject) {
           xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
           xmlDoc.async = "false";
           xmlDoc.load("index9.xml");
           }
          } 



    function searchIndex() { 
        if (!xmlDoc) {
        loadIndex();
        }
        var searchterm = document.getElementById("searchme").value;
        searchtermconvert=searchterm.toString();
        var arrsearch=xmlDoc.getElementsByTagName("Search");
        results = new Array;
                         if (searchtermconvert.length < 3) {
                        alert("Enter at least three characters");
                        } else {
                          for (var i=0;i<arrsearch.length;i++){
                                            var variable = arrsearch[i].textContent;
                                            var exp = new RegExp(searchtermconvert,"gi");
                                                    if ( variable.match(exp) != null) {                             
                                                    results.push(arrsearch[i]);
                                                    }   
                             }
                         showResults(results,searchtermconvert);
                         }
              }

2 个答案:

答案 0 :(得分:0)

提供多个搜索词的搜索结果的其他部分:

                                            var exp = new RegExp(res[0],"i");
                                            var exp2 = new RegExp(res[1],"i");
                                            var exp3 = new RegExp(res[2],"i");
                                            var exp4 =new RegExp(res[3],"i");
                                            var exp5= new RegExp(res[4],"i");

然后为if语句添加额外条件

if ( variable.match(exp) != null && variable.match(exp2) != null && variable.match(exp3) != null && variable.match(exp4) != null && variable.match(exp5) != null)

结果是您可以搜索多个搜索词。

enter image description here

答案 1 :(得分:0)

                              source code: 

        <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
        <html> 
        <head>
        <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
        <meta content="utf-8" http-equiv="encoding">
        <script type="text/javascript" src="searchindex.js"></script>
        <style>
        body{
        width:1000px;
        margin:0px auto;
        position:relative;
        top:300px;
        }
        #dd{
        position:relative;
        background:red;
        border:4px solid yellow;

        }


        #dd1{
        text-align:center;

        }

        #searchProduct{
        text-align:center;
        position:relative;
        bottom:100px;
        font-size:24px;
        font-family:"Lucida Console";
        font-weight:bold;
        }
        </style>
        </head>
        <body>


        <div id="searchProduct">Search Product</div>
        <div id="dd1">
        <form id="dd" name="myForm" action="#">
        <input type="text" id="searchme" />
        <input type="submit" onclick="searchIndex(); return false; " /><!--return false;-->
        </form>
        </div>
        <div id="resultshere">
        </div>


        </body>
        </html>

/ ---------------- Javascript -------------------- / < / p>

   window.onload = loadIndex;

   function loadIndex() { // load indexfile
   // most current browsers support document.implementation
   if (document.implementation && document.implementation.createDocument) {
   xmlDoc = document.implementation.createDocument("", "", null);
   xmlDoc.load("index9.xml");//showprices

   }
   // MSIE uses ActiveX
   else if (window.ActiveXObject) {
   xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
   xmlDoc.async = "false";
   xmlDoc.load("index9.xml");//showprices
   }
   }


   function clearBox()
   {
       document.getElementById("resultshere").innerHTML = "";
   }



   function searchIndex() { // search the index

        if (!xmlDoc) {//check whether xmlDoc is not a null
        loadIndex();
        }

        var searchterm = document.getElementById("searchme").value;
        searchtermconvert=searchterm.toString();
        var arrsearch=xmlDoc.getElementsByTagName("Search");
        results = new Array;//declare new Array called results


            var res = searchtermconvert.split(' ');

        //  alert(res[0]);
        //  alert(res[1]);

                         if (res.length < 0) {// check if the seach term is not less than 3 characters
                        alert("Enter at least three characters");
                        } else {

                          for (var i=0;i<arrsearch.length;i++){

                                //if (x[i].textContent != null) {

                                            var variable = arrsearch[i].textContent;//starts from i+1 second

                                            var exp = new RegExp(res[0],"i");// declare a regular expression object which describes a pattern of characters
                                                var exp2 = new RegExp(res[1],"i");// declare a regular expression object which describes a pattern of characters
                                            var exp3 = new RegExp(res[2],"i");
                                            var exp4 =new RegExp(res[3],"i");
                                            var exp5= new RegExp(res[4],"i");


                                            //i-Perform case-insensitive matching    g-Perform a global match (find all matches rather than stopping after the first match)  m-Perform multiline matching



                                                    if ( variable.match(exp) != null && variable.match(exp2) != null && variable.match(exp3) != null && variable.match(exp4) != null && variable.match(exp5) != null) {


                                                    results.push(arrsearch[i]);// and (if so) store it in an array


                                                    }   

                         }


                         showResults(results,res);

                         }

     }//----------------------------------------------------------------------------------------------end of searchIndex

   function showResults(results,res) {

                  if (results.length > 0) {

                 var resultshere = document.getElementById("resultshere"); // if there are any results, put them in a list inside the "resultshere" div
                 if (resultshere=>1){
                 clearBox();
                 }
                var header = document.createElement("h5");// just a markup for showing the results - heading
                var list = document.createElement("table");// just a markup for showing the results - unordered list

                var searchedfor = document.createTextNode("You've searched for " + res) ;
                resultshere.appendChild(header);// just a markup for showing the results - header
                header.appendChild(searchedfor);// just a markup for showing the results - "You've searched for "
                resultshere.appendChild(list);// just a markup for showing the results -  list = document.createElement("ul");

                                 for (var i=0;i<results.length;i++) { // go through results  Array from searchIndex()

                                //var x = ff;
                                var listitem = document.createElement("tr"); // create list item for var list = document.createElement("ul");
                                var list_td= document.createElement("td");
                                var item = document.createTextNode(results[i].textContent);
                                //var item2 = document.createTextNode(arrsearch[0].textContent);
                                //alert(arrsearch[0].textContent);
                                //alert(results[i].textContent);
                                //  list.appendChild(item2); 
                                list.appendChild(listitem);  // combine var list = document.createElement("ul"); with var listitem = document.createElement("li");
                                listitem.appendChild(item); // attach parameter item(var item = document.createTextNode(results[i].lastChild.nodeValue);) to the listitem(var item = document.createTextNode(results[i].lastChild.nodeValue);)


                                }//------------------------------------------------------------------end of for loop for (var i=0;i<results.length;i++)
                }
                else {
            // else tell the user no matches were found
                                                                                            var resultshere = document.getElementById("resultshere");// reach the element with "resultshere"
                                                                                            var para = document.createElement("p");// create and element(in this case a paragraph) for showing the "resultshere"
                                                                                            var notfound = document.createTextNode("Sorry, I couldn't find anything like "+res +"!");//create a text with a searchterm attachment
                                                                                            resultshere.appendChild(para);// append to resultshere a para variable which contains(var para = document.createElement("p"))
                                                                                            para.appendChild(notfound);// append to para variable which contains(var notfound = document.createTextNode("Sorry, I couldn't find anything like "+searchterm +"!");)

                }


      }

/ --------------------------- XML --------------- ------- /

             <?xml version="1.0" encoding="utf-8"?>
    <searchable_index>
        <Search>
 <title>driver</title>
    <keyword>101 101</keyword>
    <link>R-12</link>
        <color>white</color>
    <itemid>test</itemid>
      </Search>
      <Search>
       <title>driver</title>
    <keyword>102</keyword>
    <link>R-22</link>
        <color>red</color>
 <itemid>1test</itemid>
      </Search>
    <Search>
     <title>driver</title>
    <keyword>101</keyword>
    <link>R-12 yellow</link>
        <color>yellow</color>
 <itemid>2_3_test</itemid>
      </Search>
      <Search>
       <title>hammer</title>
    <keyword>102</keyword>
    <link>R-22</link>
        <color>yellow</color>
 <itemid>3test</itemid>
      </Search>
    <Search>
     <title>saw</title>
    <keyword>101</keyword>
    <link>R-12</link>
        <color>black yellow</color>
 <itemid>001</itemid>
      </Search>
      <Search>
       <title>driver</title>
            <keyword>102 dewalt</keyword>
            <link>R-23</link>
           <color>redyellow</color>
    <itemid>100</itemid>
      </Search>
        <Search>
         <title>driver</title>
            <keyword>102</keyword>
            <link>R-23</link>
           <color>blackblack</color>
    <itemid>100</itemid>
      </Search>
          <Search>
         <title>driver</title>
            <keyword>101 101</keyword>
            <link>R-12</link>
        <color>white</color>
    <itemid>test</itemid>
      </Search>
      <Search>
       <title>driver</title>
            <keyword>102</keyword>
            <link>R-22</link>
        <color>red</color>
         <itemid>1test</itemid>
      </Search>
    <Search>
     <title>driver</title>
            <keyword>101</keyword>
            <link>R-12 yellow</link>
        <color>yellow</color>
         <itemid>2_3_test</itemid>
      </Search>
      <Search>
       <title>hammer</title>
            <keyword>102</keyword>
            <link>R-22</link>
        <color>yellow</color>
         <itemid>3test</itemid>
      </Search>
    <Search>
     <title>saw</title>
            <keyword>101</keyword>
            <link>R-12</link>
        <color>black yellow</color>
         <itemid>001</itemid>
      </Search>
      <Search>
       <title>driver</title>
            <keyword>102 dewalt</keyword>
            <link>R-23</link>
           <color>redyellow</color>
            <itemid>100</itemid>
      </Search>
        <Search>
         <title>driver</title>
            <keyword>102</keyword>
            <link>R-23</link>
           <color>blackblack</color>
    <itemid>100</itemid>
      </Search>
          <Search>
         <title>driver</title>
            <keyword>101 101</keyword>
            <link>R-12</link>
        <color>white</color>
    <itemid>test</itemid>
      </Search>
      <Search>
       <title>driver</title>
            <keyword>102</keyword>
            <link>R-22</link>
                <color>red</color>
         <itemid>1test</itemid>
      </Search>
    <Search>
     <title>driver</title>
            <keyword>101</keyword>
            <link>R-12 yellow</link>
        <color>yellow</color>
         <itemid>2_3_test</itemid>
      </Search>
      <Search>
       <title>hammer</title>
            <keyword>102</keyword>
            <link>R-22</link>
        <color>yellow</color>
         <itemid>3test</itemid>
      </Search>
    <Search>
     <title>saw</title>
            <keyword>101</keyword>
            <link>R-12</link>
        <color>black yellow</color>
         <itemid>001</itemid>
      </Search>
      <Search>
       <title>driver</title>
            <keyword>102 dewalt</keyword>
            <link>R-23</link>
           <color>redyellow</color>
    <itemid>100</itemid>
      </Search>
        <Search>
         <title>driver</title>
            <keyword>102</keyword>
            <link>R-23</link>
           <color>blackblack</color>
    <itemid>100</itemid>
      </Search>
    </searchable_index>