JavaScript的导通元件从一个功能到另一个

Question

这是部分代码：

function readXmlUsingXPath(i,guid, xpath) { 
    var xmlDoc = loadXML("gameFeed.aspx?guid=" + guid); 
    if (xmlDoc == null) { document.getElementById(guid).innerHTML = "UPDATING"; return } 
    else { }; 
    i.innerHTML = xmlDoc.selectNodes(xpath)[0].text; 
} 

window.onload = function() { 
    for (var i = 0; i < document.getElementsByTagName('jackpot').length; i++) { 
     var guid = document.getElementsByTagName('jackpot')[i].getAttribute('data-g').split('|')[0]; 
     var xpath = document.getElementsByTagName('jackpot')[i].getAttribute('data-g').split('|')[1]; 
     readXmlUsingXPath(document.getElementsByTagName('jackpot')[i],guid, xpath); 
    } 
} 

基本上，我想要做的是从的onload函数传递元素，给readXmlUsingXpath功能，所以我可以改变它。 ，但我得到一个未知的运行时错误...

的要求，一些样品的html：

<li> 
<a href="/gamepath/"><span>gameTitle</span> 
<span><jackpot data-g="<%=game.Guid %>|<%=game.GamingProperties.JackpotFeedXpath %>">UPDATING . . .</jackpot></span> 
</a> 
</li> 

Answer 1

好的，所以我修改了一下代码， 并且使它更简单。

现在它的工作原理如下。

function loadXMLDoc(guid,xpath,i) { 

    var xmlhttp; 
    if (window.XMLHttpRequest) {xmlhttp = new XMLHttpRequest();} 
    else {xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");} 
    xmlhttp.async = true; 
    xmlhttp.onreadystatechange = function() { 
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
      i.innerHTML = xmlhttp.responseXML.selectNodes(xpath)[0].text; 
     } 
    } 
    xmlhttp.open("GET", "gameFeed.aspx?guid=" + guid, true); 
    xmlhttp.send(); 
} 

var tags = document.getElementsByTagName("pre"); 
for (var i = 0; i < tags.length; i++) { 
    var data = tags[i].getAttribute('data-g').split('|'), guid = data[0], xpath = data[1]; 
    loadXMLDoc(guid,xpath,tags[i]); 
} 

Answer 2

嗯，首先，是的 - 缓存getElementsByTagName()和.getAttribute('data-g').split('|')结果到一个变量：

var myDataG = MyJackpotElement.getAttribute('data-g').split('|'); 

然后，不要处理来自HTML源代码的XPath，因为无论如何您都要将​​传递给服务器端脚本，请让服务器脚本处理服务器端的项目（使用XPath） - 所以它会得到你使用GUID :)

加载使服务器端脚本的项目XPath表达式返回你你正在寻找（gameFeed.aspx?guid=）的值，而不是XML，你将进一步在客户端进行查找价值。

Answer 3

根据Denis的建议重构代码后代码是否工作？

即使除了巨大的性能打击之外，您继续执行getElementsByTagName的方式的一个主要问题是如果集合因任何原因而更改，则长度可能不再正确，并且您可能正在请求元素9只有8个存在。

此外，更改元素的innerHTML可能会导致浏览器关闭。

Side nit：我已将readXmlUsingXPath函数的i参数重命名为jackpot，这似乎比i稍合适一些。

function readXmlUsingXPath(jackpot, guid, xpath) { 
    var xmlDoc = loadXML("gameFeed.aspx?guid=" + guid); 
    if (xmlDoc == null) { 
     document.getElementById(guid).innerHTML = "UPDATING"; 
     return; 
    } 
    var firstNode = xmlDoc.selectNodes(xpath).item(0); 
    jackpot.innerHTML = firstNode.text; 
} 

window.onload = function() { 
    var jackpots = document.getElementsByTagName('jackpot'); 
    for (var i = 0; i < jackpots.length; i++) { 
     var data = jackpots[i].getAttribute('data-g').split('|'), 
     guid = data[0], 
     xpath = data[1]; 
     readXmlUsingXPath(jackpots[i], guid, xpath); 
    } 
}