不同的結果選擇在Firefox和Internet Explorer使用XPath的HTML元素

Question

我想在文檔中選擇一個特定的HTML元素，用於Firefox我只是使用：

xpathobj = document.evaluate(xpath, document, null, 
       XPathResult.FIRST_ORDERED_NODE_TYPE, null); 

工作正常。但是，當我嘗試IE equivilent：

xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); 
xmlDoc.async=false; 
xmlDoc.load(document); 
xmlDoc.setProperty("SelectionLanguage", "XPath"); 
xpathobj = xmlDoc.selectNodes(xpath); 

我得不到任何對象返回。所以我的問題是有沒有一種簡單的方法來使用XPath到達我想在IE中使用的元素？ 我使用看起來像XPath的

/HTML/BODY/DIV[9]/DIV[2] 

Answer 1

確定XPath是在您的Internet Explorer的版本中實現？如：您使用的是哪個版本？

Answer 2

看看http://dev.abiss.gr/sarissa/項目。他們已將大部分與XML相關的API遷移到IE。否則它的確很容易實現。您需要解決的問題是：將HTML序列化爲有效的XML，將XMLDOM XPath查詢的結果與原始HTMLDOM同步。據我所知他們已經在他們的圖書館做過，但是，它的表現可能會更好。

Answer 3

jQuery執行a cross-browser-compatible subset of xPath selectors with a plug-in。你的例子「/ HTML/BODY/DIV [9]/DIV [2]」應該可以工作。

（編輯 - 糾正感謝謝爾蓋Ilinsky）

Answer 4

而不是做

xmlDoc.load(document); 

嘗試

xmlDoc.loadXML(document.body.outerHTML) 

如果你對你的HTML文檔的格式XHTML標準這隻會真正發揮作用。此外，BODY標籤將作爲根節點，所以你將不得不將XPATH更改爲「/ BODY/DIV [9]/DIV [2]」

Answer 5

我會有點擔心使用這樣的XML ，因爲您無法確定某個人擁有的XML DLL的版本（如果有）。還有很多公司在那裏使用IE5.0，而5.5有一個特別嚴格的XML實現。

Answer 6

嗨，最後我想出了我自己的狡猾的解決方案，任何改善它的建議都會大大降低。它利用一些原型的功能：

工程在IE5 +與以下形式的 「/ HTML/BODY/DIV [9]/DIV [2]」

功能getXPathElement（XPath中，元件）的xpath {

//Specific to project, here i know that the body element will always have the id "top" 
//but otherwise the element that is passed in should be first element in the xpath 
//statement eg. /HTML/BODY/DIV the element passed in should be HTML 
if(!element){ 
    element = $("top"); 
    var xpathArrayIndex = 3; 
} else { 
    var xpathArrayIndex = 1; 
} 
//split the xpath statement up 
var xpathArray = xpath.split("/"); 

var carryOn = true; 
while(carryOn){ 
    decendents = element.childElements(); 
    //check to see if we are at the end of the xpath statement 
    if(xpathArrayIndex == xpathArray.length){ 
     return element; 
    } 
    //if there is only one decendent make it the next element 
    if(decendents.size() == 1) { 
     element = decendents.first(); 
    } else { 
    //otherwise search the decendents for the next element 
     element = getXPathElementByIndex(decendents, xpathArray[xpathArrayIndex]); 
    } 
    xpathArrayIndex++; 
} 

}

功能getXPathElementByIndex（decendents，xpathSegment）{

var decendentsArray = decendents.toArray(); 
//seperate the index from the element name 
var temp = xpathSegment.split("["); 
var elementName = temp[0]; 
//get the index as a number eg. "9]" to 9 
var elementIndex = +temp[1].replace("]", ""); 
//the number of matching elements 
var count = 0; 

//keeps track of the number of iterations 
var i = 0; 
while(count != elementIndex) { 
    //if the decendent's name matches the xpath element name increment the count 
    if(decendentsArray[i].nodeName == elementName){ 
     count++; 
    } 
    i++; 
} 
var element = decendentsArray[i - 1]; 
return element; 

}

感謝大家對他們的幫助，無論哪種方式，我學到了一點關於各種javascript框架。

Answer 7

W3C Dom Level 3 XPath的另一個JavaScript實現可以找到on Source Forge。但似乎並不活躍。

Answer 8

問題可能是在IE5 + [1]其實是FF [2]。微軟決定編號應該從w3c指定的[0]開始，而不是[1]開始。

Answer 9

我無法找到一個簡單的和通用的解決方案，您可以編寫自定義函數來實現一個小的XPath，但它是很難獲得在Internet Explorer 6或更低版本的完整....

Answer 10

有一些oly1234的代碼中的錯誤我嘗試修復它，如下所示：

function getXPathElement(xpath, element){ 
if(!element){ 
    element = document; 
} 
var xpathArray = xpath.split("/"); 

element = findXPathRoot(xpathArray[0],xpathArray[1],element); 

for(var i=1; i<xpathArray.length; i++){ 
    if(xpathArray[i].toLowerCase()=="html"){ 
     continue; 
    } 
    if(!element){ 
     return element; 
    } 
    element = getXPathElementByIndex(element.childNodes,xpathArray[i]);   
} 
return element; 
} 


function findXPathRoot(rootPath,htmlPath,element){ 
if(rootPath == ""&&htmlPath.toLowerCase() == "html"){ 
    return element.documentElement; 
} 
return document.getElementsByTagName(rootPath)[0]; 
} 
function getXPathElementByIndex(decendents, xpathSegment){ 
//seperate the index from the element name 
var temp = xpathSegment.split("["); 
var elementName = temp[0]; 
//get the index as a number eg. "9]" to 9 
if(temp[1]){ 
    var elementIndex = temp[1].replace("]", ""); 
}else{ 
    var elementIndex = 1; 
} 
//the number of matching elements 
var count = 0; 
for(var i=0;i < decendents.length; i++){ 
    if (decendents[i].nodeName.toLowerCase() == elementName.toLowerCase()) { 
     count++; 
     if(count==elementIndex){ 
      return decendents[i]; 
     } 
    } 
} 
return null; 
}