documentとHTMLElementにgetElementByXPath定義する

ブラウザのコンソールでのちょっとした作業用。探せば色々見つかるのだけど、 documentに対してだけではなく、どのHTMLElementに対しても実行できるところまでまとまってるのはあまりないようだったので。

(() => {

  const __getElementByXPath = function(path, root) {
    const result = document.evaluate(path, root, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null)
    return result.snapshotLength > 0 ? result.snapshotItem(0) : null
  }
  const __getElementsByXPath = function(path, root) {
    const array = []
    const result = document.evaluate(path, root, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
    for (let i = 0; i < result.snapshotLength; i++) {
      array.push(result.snapshotItem(i));
    }
    return array;
  }

  document.getElementByXPath = function(path) {
    return __getElementByXPath(path, this)
  }
  document.getElementsByXPath = function(path) {
    return __getElementsByXPath(path, this)
  }
  HTMLElement.prototype.getElementByXPath = function(path) {
    return __getElementByXPath(path, this)
  }
  HTMLElement.prototype.getElementsByXPath = function(path) {
    return __getElementsByXPath(path, this)
  }
  
})()