Question

是XML / HTML节点的新手，我正在处理代码，它在IE中运行良好，但在其他浏览器中却不行。下面是一段代码，担心：

if (window.XMLHttpRequest)
  {
  xmlhttp = new XMLHttpRequest();
  }
else
  {
  xmlhttp =new ActiveXObject("Microsoft.XMLHTTP");
  }

xmlhttp.open("GET","SMoutput.xml",false);
xmlhttp.send();
xmlDoc = xmlhttp.responseXML;

//xmlDoc.async="false";
//xmlDoc.load("./SMoutput.xml");

var Server=xmlDoc.documentElement;
var fts = Server.childNodes[1];
var rows = Server.childNodes.length;
var cols = fts.childNodes.length;

var body = document.getElementsByTagName("body")[0];
//var tabl = document.createElement("table");
var tabl = document.getElementById("ftsinfo");
var tblBody = document.createElement("tbody");

for (var i = 0; i < rows; i++)
{
    var row = document.createElement("tr");
    var length=0;
    fts = Server.childNodes[i];

    for (var j = 0; j < cols; j++)
    {
        var cell = document.createElement("td");


        ***var define=fts.childNodes[j].childNodes[0].nodeValue;
        var cellText = document.createTextNode(define);***


        cell.appendChild(cellText);
        row.appendChild(cell);

        length= length+cell.innerText.length;
        //cell.innerText= length

        if ( length > max)
        {
            max=length;
        }


        if(cell.innerText=="Up")
        {
            cell.innerText=""
            //cell.innerText= max
            cell.style.backgroundImage="url('up.png')";

        }

        if(cell.innerText=="Down")
        {
            cell.innerText=""
            //cell.innerText= max
            cell.style.backgroundImage="url('down.png')";


        }


        row.style.fontSize= "14";
        row.style.color= "black";
    }

tblBody.appendChild(row);
tabl.appendChild(tblBody);
tabl.setAttribute("border", "1");

这是一个在下面的Body onload期间调用的函数：

<BODY onload="PingServer();showResult();DoInit();" onrefresh="PingServer();">

    <div id="contents">
        <h4 style="font-family:verdana;color:brown" align="center">Mining Services Monitor</h4>

        <table id="ftsinfo" align="center">
                <tr bgcolor='lightgray' style="font-family:verdana;color:Brown;font-size:12px">
                    <td>Service</td><td>Host</td><td>Port</td><td>Status</td>
                </tr>

        </table>
    </div>
</BODY>

关于进一步的故障排除，我发现这段代码导致了问题：

var define=fts.childNodes[j].childNodes[0].nodeValue;
var cellText = document.createTextNode(define);

当我打开链接时，chrome不会加载数据并说“

未捕获的TypeError：无法读取未定义“
的属性'childNodes'

，当它通过第一行时var define = fts.childNodes [j] .childNodes [0] .nodeValue

我想要的是将要从子节点传递的文本值传递给要显示的celltext变量。

这适用于IE，但不适用于其他浏览器，我也是新手。发现很难破解。请帮忙。

以下是SMoutput.xml的示例：

<network>
 <server>
<name>PROD JBOSS Service</name>
<host>Hostname1</host>
<port>Portnumber1</port>
<result>Up</result>
</server>
<server>
<name>PROD Database</name>
<host>Hostname2</host>
<port>Portnumber2</port>
<result>Down</result>
</server>

Answer 1

我建议不要使用childNodes集合，因为依赖于元素节点之间的空白文本节点以及DOM实现是否将它们包含在树中，您可以使用不同的实现获得不同的结果。相反，如果您有xmlDoc = xmlhttp.responseXML;，则可以使用getElementsByTagName例如

var serverElements = xmlDoc.getElementsByTagName("server");
for (var i = 0, l = serverElements.length; i < l; i++) {
  var server = serverElements[i];
  var nameEl = server.getElementsByTagName("name")[0];
  var hostEl = server.getElementsByTagName("host")[0];
  var portEl = server.getElementsByTagName("port")[0];
  var resultEl = server.getElementsByTagName("result")[0];
  // now here you can extract the data, for older versions of IE you need to access the `.text` property, for other browsers and recent version the `.textContent` property e.g.
  var name = nameEl.textContent ? nameEl.textContent : nameEl.text;
  var host = hostEl.textContent ? hostEl.textContent : hostEl.text;
  // here you can add the `name`, `host` etc. to your HTML table
}

未捕获的TypeError：无法读取未定义的属性'childNodes'在Chrome和Mozilla中无效

1 个答案: