Javascript 无法读取属性'；子节点'；尝试从XML文件检索数据时的未定义值_Javascript_Ajax_Xml

Javascript 无法读取属性'；子节点'；尝试从XML文件检索数据时的未定义值

javascript ajax xml

Javascript 无法读取属性'；子节点'；尝试从XML文件检索数据时的未定义值,javascript,ajax,xml,Javascript,Ajax,Xml,根据这一准则 <style> table,th,td { border : 1px solid black; border-collapse: collapse; } th,td { padding: 5px; } </style> <body> <form> <input type="text" id="word" value=""/> <button type="button" onclick="loa

根据这一准则

<style>
table,th,td {
  border : 1px solid black;
  border-collapse: collapse;
}
th,td {
  padding: 5px;
}
</style>
<body>


<form>
  <input type="text" id="word" value=""/>
  <button type="button" onclick="loadDoc()">Retrieve data</button>
  <br>

</form>

<br><br>
<table id="demo"></table>



<script type="text/javascript">// <![CDATA[
function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      myFunction(xhttp);
    }
  };
  xhttp.open("GET", "URL" + $('#word').val(), true);
  xhttp.send();
}

function myFunction(xml) {
  var i;
  var xmlDoc = xml.responseXML;
  var table="<tr><th>Japanese</th><th>Pronunciation</th><th>English</th></tr>";
  var x = xmlDoc.getElementsByTagName("json");

  for (i = 0; i <x.length; i++) { 
    table += "<tr><td>" +
    x[i].getElementsByTagName("japanese")[0].childNodes[0].nodeValue +
    "</td><td>" +
    x[i].getElementsByTagName("pronunciation")[0].childNodes[0].nodeValue +
    "</td><td>" +
    x[i].getElementsByTagName("english")[0].childNodes[0].nodeValue +
    "</td>" + " " + "</tr>";
  }

  document.getElementById("demo").innerHTML = table;
}
// ]]></script>


表，th，td{
边框：1px纯黑；
边界塌陷：塌陷；
}
th，td{
填充物：5px；
}
检索数据





//

当“发音”标签没有价值时，我怎么能跳过它呢

更具体地说，我的XML文件有不同的标记——“日语”（一个单词或汉字）、“发音”（单词的读法，在平假名中，只有当它是汉字时才有值）和“英语”（单词的含义）

每当“发音”标记缺少值时，当前代码就不起作用，这意味着没有发音的每个单词都会导致站点不显示任何内容

XML文件：

<json> //This entry has pronunciation
<japanese>原爆</japanese>
<pos>n</pos>
<pronunciation>げんばく</pronunciation>
<english>(abbr) (See 原子爆弾) atomic bomb A-bomb</english>
</json>
<json> //This entry does not have pronunciation as it is not needed
<japanese>ダム</japanese>
<pos>n</pos>
<english>dam/(adj-f)</english>
<english>dumb</english>
</json>

//此条目有发音
原爆
N
げんばく
（缩写）（见原子爆弾) 原子弹
//此条目没有发音，因为它不需要
ダム
N
大坝/（adj-f）
哑的

谢谢！

从您的示例数据中，发音元素在不需要时被完全省略。因此getElementsByTagName（“发音”）返回undefined，因此无法从中获取[0]

您可以测试返回的内容并做出适当的响应，如下所示：

var pron = getElementsByTagName("pronunciation");
if (pron) { table += pron[0].childNodes[0].nodeValue; }

这假设您将“表”的一个长赋值拆分为单独的部分。通常，您会发现将其分解为以下函数很有用：

function getOptionalContentAsTD(ename) {
    var el = getElementsByTagName(ename);
    var txt = "";
    if (el) { txt = el[0].childNodes[0].nodeValue; }
    return("<td>" + txt + "</td>");
}

函数getOptionalContentAsTD（ename）{ var el=getElementsByTagName（ename）； var txt=“”； if（el）{txt=el[0].childNodes[0].nodeValue；} 返回（“+txt+”）； } 我没有测试这个，所以可能是打字错误，但它给出了想法

希望这能有所帮助。

啊，哇。我没有注意到标签被完全省略了！无论如何，我对Javascript非常陌生，所以即使我了解您的代码的功能，我也不知道如何调整它以使其正常工作。我已经更新了我的帖子，将HTML代码和XMLHttp请求也包括在内。谢谢您的帮助！更新：我知道了如何解决我的问题，非常感谢！