JavaScriptでXPath 特定の文字列を含む要素を取得

// XPath に変数を用いる際はクォーテーションの外に書くこと

window.addEventListener('load', function(event) {
  var xpathText = 'bbbbbb';
  var xpathResult = document.evaluate(
    '//span[contains(text(), "'+ xpathText +'")]',
    document,
    null,
    XPathResult.FIRST_ORDERED_NODE_TYPE,
    null
  );
  console.log(xpathResult);
  xpathResult.singleNodeValue.style.color = "#faa";


  thElement = xpathResult.singleNodeValue.parentNode.parentNode.parentNode;
  console.log(thElement);
  targetInputs = thElement.querySelectorAll('input');
  console.log(targetInputs);
  targetInputs.forEach(function(item){
    item.checked = true;
  });




// XPath で特定の小要素を持つ親要素の中の別の孫要素を探す
// xpathResultには forEach が効かないのでiteratorかforを使う。

  var xpathText1 = 'bbbbbb';
  var xpathText2 = 'bcbcbc';
  var xpathResult = document.evaluate(
  '//tr[.//span[contains(text(), "' + xpathText1 + '")]]' + 
  '//span [contains(text(), "' +xpathText2 + '")]',
    document,
    null,
    XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
    null
  );
  for(var i=0;i<xpathResult.snapshotLength;i++){
    target = xpathResult.snapshotItem(i);
    target.style.color = "#00f";
    console.log(target);
  }
});

td{
  border:1px solid #000;
  padding:8px;
}

ページのソースを表示 : Ctrl+U , DevTools : F12

view-source:https://hi0a.com/demo/-js/js-xpath-contains/