如何使用 JavaScript 从 XML 调用特定条目答案

【问题标题】：How can I call specific entries from XML using JavaScript如何使用 JavaScript 从 XML 调用特定条目
【发布时间】：2019-02-24 07:21:27
【问题描述】：

所以我有这个 XML 代码

<book>
<bookname>book1</bookname>
<author>authorman</author>
</book>
<book>
<bookname>book2</bookname>
<author>authorperson</author>
</book>

我希望能够根据作者的姓名使用作者获取书名，反之亦然，并使用 JavaScript 将其分配给变量。我试图避免使用服务器端编程并且只想使用 JavaScript。这是我第一次在这里发帖，因为我是一名最近学习编程的高中生。

【问题讨论】：

标签： javascript ajax xml

【解决方案1】：

您可以将XMLHttpRequest() responseType 属性设置为"document"，将overrideMimeType() 设置为"text/html" 以在load 处理程序中将HTML #document 设置为response。

创建一个函数，该函数期望一个普通对象作为参数传递，具有 "author" 或 "bookname" 属性，其值设置为 XML <book> 元素 <bookname> 或 @987654335 的 textContent @ 匹配。迭代<book>元素的NodeList和childrenHTMLCollection，检查localName是否等于"bookname"或"author"，textContent匹配传递给函数的参数，如果为真，获取@ 987654344@ 引用，如果"author" 是对象参数的属性，则使用.querySelector() 和"bookname"，如果"bookname" 作为参数传递，则使用"author"，返回匹配元素的textContent，或'"author of <bookname> OR book by <author>" not found.'。

const request = new XMLHttpRequest();
request.responseType = "document";
request.overrideMimeType("text/html");
const xml = `<?xml version="1.0" encoding="UTF-8"?><book>
<bookname>book1</bookname>
<author>authorman</author>
</book>
<book>
<bookname>book2</bookname>
<author>authorperson</author>
</book>`;
const getBookData = (books, {bookname, author} = {}) => {
  for (const {children} of books) { 
    for (const book of children) {
      const {localName, textContent} = book;       
        if (localName === "bookname" && bookname === textContent 
            || localName === "author" && author === textContent) {
          return book.parentElement
                 .querySelector(author ? "bookname" : "author")
                 .textContent
         }
       }
     }
     return `${author ? "book by" : "author of"} "${bookname || author}" not found in library.`;
}
request.addEventListener("load", e => {
  const html = request.response;
  const books = html.querySelectorAll("book");
  console.log(getBookData(books, {author:"authorman"}));
  console.log(getBookData(books, {bookname:"book2"}));
  console.log(getBookData(books, {author:"authorx"}));
  console.log(getBookData(books, {bookname:"book3"}));
})
request.open("GET", `data:application/xml,${encodeURIComponent(xml)}`);
request.send();

【讨论】：

谢谢！这就像一个魅力，但现在我想扩展我的搜索方法，我需要做的是 xml 代码

【解决方案2】：

试试这个

  var text, parser, xmlDoc;  

    text="<book>
    <bookname>book1</bookname>
    <author>authorman</author>
    </book>
    <book>
    <bookname>book2</bookname>
    <author>authorperson</author>
    </book>";  

    parser = new DOMParser();
    xmlDoc = parser.parseFromString(text,"text/xml");

    console.log(xmlDoc.getElementsByTagName("book")[0].childNodes[0].nodeValue); //book1

    console.log(xmlDoc.getElementsByTagName("book")[1].childNodes[0].nodeValue); //book2

【讨论】：

【解决方案3】：

希望这会对你有所帮助：-

<script type="text/javascript">
  var xml = "<xml>"+
            "<book>"+
              "<bookname>book1</bookname>"+
              "<author>authorman</author>"+
            "</book>"+
            "<book>"+
              "<bookname>book2</bookname>"+
              "<author>author2</author>"+
            "</book>"+
            "</xml>";

  parser = new DOMParser();
  xmlDoc = parser.parseFromString(xml,"text/xml");
  authors   = xmlDoc.getElementsByTagName("author");
  booknames = xmlDoc.getElementsByTagName("bookname");

  var bookname = searchByAuthor('authorman', authors, booknames);
  alert(bookname);

  var authorname = searchByBookName('book2', authors, booknames);
  alert(authorname);
  
  function searchByAuthor(author_name, x, y){
      
      for (i = 0; i < x.length; i++) {
          if(x[i].childNodes[0].nodeValue == author_name){
            return y[i].childNodes[0].nodeValue;
          }  
      }
  }

  function searchByBookName(book_name, x, y){

    for (i = 0; i < y.length; i++) {
          if(y[i].childNodes[0].nodeValue == book_name){
            return x[i].childNodes[0].nodeValue;
          }  
      }
  }
</script>

【讨论】：