的Javascript：使用XPath jQuery中

我有，例如，下XPath查詢：的Javascript：使用XPath jQuery中

//div[span="something"]/parent::div/child::div[@class=\"someClass\"]

我想在JavaScript中使用此XPath查詢：

return $("a:contains('Fruits')").mouseover();

我嘗試這樣做：

return $("div[span=\"something\"]/parent::div/child::div[@class=\"someClass\"]").mouseover();

但它沒有奏效。爲了在JavaScript中使用它們，是否有另一種XPath查詢的語義？

來源

2012-09-03 Adam Sh

可以重新寫你的XPath查詢爲CSS選擇器：

$('div:has(> div > span:contains(something)) > div.someClass');

您可以使用:has pseduo選擇基於其孩子選擇一個元素實現爲parent::同樣的效果：div.foo:has(> div.bar)將選擇所有div元素foo有孩子div與類bar。這相當於div[@class="bar"]/parent::div[@class="foo"]。

請參見：

你也許可以使用各種組合jQuery's DOM traversal methods幾個其他的方式接近這一點。例如，這將是你的XPath查詢的一個非常直接的翻譯：

$('div:has(> span:contains(something))') // //div[span="something"] 
    .parent('div')      // /parent::div 
    .children('div.someClass');   // /child::div[@class="someClass"]

值得一提的是，在div.someClass CSS不是div[@class="someClass"] XPath中的完全等效。 CSS將匹配<div class='foo someClass bar'>，但xpath不會。有關更多詳細信息，請參閱Brian Suda's article on parsing microformats with XSLT。

來源

2012-09-03 08:00:26 georgebrock

是CSS支持parent :: div子句嗎？ –

我對CSS轉換的xpath是錯誤的，我已經糾正它，並解釋瞭如何再現'parent :: div'。 – georgebrock

讀從這裏有關evaluate方法： https://developer.mozilla.org/en-US/docs/Introduction_to_using_XPath_in_JavaScript

var xpathResult = document.evaluate(xpathExpression, contextNode, namespaceResolver, resultType, result);

來源

2012-09-03 07:41:46 CosminO

我不知道有關parent::div條款，但沒有它，它應該是這樣的：

$('div[span="something"] div.someClass');

來源

2012-09-03 07:42:42 Constantinius

在XPath'DIV [ span =「something」]''選擇具有文本值爲'something'的子'span'的'div'元素，但它不尋找'span'屬性。我認爲你將它與（非常相似的）'div [@ span =「something」]'混合在一起。看例子：http://www.w3.org/TR/xpath/#path-abbrev – georgebrock

jQuery的只有對XPath的有限支持。你可以看到它在這裏支持： http://docs.jquery.com/DOM/Traversing/Selectors#XPath_Selectors

正如@Ameoo提到你可以使用評估方法，這是可以在最現代的瀏覽器 - 除了，可以預見，IE： jquery select element by xpath

來源

2012-09-03 07:43:41

沒有據我所知，跨瀏覽器的實現。有一個xpath plugin jQuery的說，仍然在發展。

除此之外，還有一個谷歌編寫的DOM Level 3 XPath規範的純JavaScript實現，名爲wicked-good-xpath，這很好。

來源

2012-09-03 07:51:34

作爲Wicked Good XPath的共同作者，我當然推薦它支持跨瀏覽器XPath（在HTML文檔上，你可以嘗試在XML文檔中使用它，但支持不完整）。

我們歡迎任何類型的正確性測試/性能基準在我們的圖書館。在開發過程中，該庫已在IE 7至10以及沒有本機XPath支持的Android 2.2瀏覽器上進行測試。

來源

2012-09-07 19:32:34 Dominator008

您可以將現有的XPath評估的結果添加到jQuery選擇中，我將這個jquery擴展組合在一起，看起來完全適合您。

用法示例：

$(document).xpathEvaluate('//body/div').remove()

這裏的加載項。

$.fn.xpathEvaluate = function (xpathExpression) { 
    // NOTE: vars not declared local for debug purposes 
    $this = this.first(); // Don't make me deal with multiples before coffee 

    // Evaluate xpath and retrieve matching nodes 
    xpathResult = this[0].evaluate(xpathExpression, this[0], null, XPathResult.ORDERED_NODE_ITERATOR_TYPE, null); 

    result = []; 
    while (elem = xpathResult.iterateNext()) { 
     result.push(elem); 
    } 

    $result = jQuery([]).pushStack(result); 
    return $result; 
}

來源

2013-12-10 13:32:24 Orwellophile

這是一個很好的解決方案，謝謝。 – tenfour

感謝那真棒代碼:)它真的幫助我。 – interstellarDust

作品剛剛完美 – TechDog

，如果你想選擇一個iframe中的元素，從父窗口，你應該evaulate（）函數的第二個參數更改爲iframe的文檔元素，如：

var iFrameDocument = $('iframe#myPage').get(0).contentWindow.document; 
xpathResult = this[0].evaluate(xpathExpression, iFrameDocument, null, XPathResult.ORDERED_NODE_ITERATOR_TYPE, null);

來源

2014-08-24 18:15:02 spetsnaz

的Javascript：使用XPath jQuery中

回答

相關問題