AJAX / PHP/XML - 通过 Javascript 获取一些数据答案

【问题标题】：AJAX / PHP/XML - Get some datas via JavascriptAJAX / PHP/XML - 通过 Javascript 获取一些数据
【发布时间】：2017-01-18 12:03:18
【问题描述】：

我的 PHP 文件通过我的数据库生成 XML，此文件有效，问题出在 JavaScript 部分。

情况：当我输入一个字母时，我可以从我的 PHP 生成的 XML 中获取数据。

PHP

<?php
  $bdd = new mysqli("localhost", "root", "", "sommets");
  if ($bdd->connect_error) {die("Impossible de se connecter");}
  $bdd->set_charset("utf-8");

  if (isset($_GET['recherche'])) {
     $recherche = addslashes($_GET['recherche']);
     $sql = "SELECT * from sommets where som_nom like '$recherche%'";
     $rec = $bdd->query($sql) or die($bdd->error);
     header("Content-type: text/xml");
     echo("<sommets>");
  while ($row = $rec->fetch_object()) {
      echo("<sommet altitude=\"{$row->som_altitude}\">");
      echo("<nom>{$row->som_nom}</nom>");
      echo("<region>{$row->som_nom}</region>");
      echo("</sommet>");
  }
  echo("</sommets>");  
}
?>

Javascript

<input type="text" name="r" id="recherche"/>
<div id="nom"></div>
<script>
  document.getElementById('recherche').addEventListener('keyup', function(){
  var nom = document.getElementById("nom");
  nom.innerHTML = "";
  var xhr = new XMLHttpRequest();
  xhr.onreadystatechange = function() {
  if (xhr.readyState<4) return;
  var resultatsXML = xhr.responseXML.getElementsByTagName("sommets");
  if(resultatsXML.length > 0){
    for (var i=0; i<resultatsXML.length; i++) {
    var nom_sommet = resultatsXML[i].getElementsByTagName("nom")[i].
                                              childNodes[0].nodeValue;
    document.getElementById("nom").innerHTML += nom_sommet[i]
                                           .childNodes[0].nodeValue;
    }
 }
}
var r = document.getElementById("recherche").value;
   if(r != ""){
     xhr.open("GET", "TP09_AJAX_XML.php?recherche="+r);
     xhr.send(); 
    } else { nom.innerHTML = ""; } 
   });

我有这个错误：

Uncaught TypeError: Cannot read property '0' of undefined

或与“fistChild”或“nodeValue”相同。我只想从 PHP 生成的 XML 中读取一个括号。

你有什么想法吗？

【问题讨论】：

.childNodes[0] 不是一棵树，.childNodes[0].childNodes 是未定义的，只是在childNodes[0] 之后立即获取.nodeValue

标签： javascript php ajax xml

【解决方案1】：

首先，使用xhr.responseXML.getElementsByTagName时应使用“sommet”而不是“sommets”。

其次，resultatsXML[i].getElementsByTagName("nom")[i] 将变量 i 用于resultatsXML 和getElementsByTagName 的结果。如果，作为第一点，resultatsXML[i] 包含一个“sommet”，那么根据您的示例，getElementsByTagName 将只返回一个 XML 标记，所以它应该是：

var resultatsXML = xhr.responseXML.getElementsByTagName("sommet");
if(resultatsXML.length > 0){
    for (var i=0; i<resultatsXML.length; i++) {
        var nom_sommet = resultatsXML[i].getElementsByTagName("nom")[0].nodeValue;
        document.getElementById("nom").innerHTML += nom_sommet;
    }
}

如果我没有正确理解问题，请纠正我。

【讨论】：

【解决方案2】：

未捕获的类型错误：无法读取未定义的属性“0”

意思是

resultatsXML[i].getElementsByTagName("nom")[i].childNodes

未定义，因为

resultatsXML[i].getElementsByTagName("nom")[i]

不是一棵树加上它，你只有一个值

还将[i] 更改为[0]

resultatsXML[i].getElementsByTagName("nom")[0]

立即从resultatsXML[i].getElementsByTagName("nom")[0] 获取.nodeValue

var nom_sommet = resultatsXML[i].getElementsByTagName("nom")[0].nodeValue;
document.getElementById("nom").innerHTML += nom_sommet;

【讨论】：