在HTML5中注入一个定制元素，然后使用XPath检索它的值，结果为空

<!-- 定义一个简单的定制元素 -->
<script>
  class MyCustomElement extends HTMLElement {
    constructor() {
      super();
      this.attachShadow({ mode: 'open' });
      this.shadowRoot.innerHTML = `<p>这是我的定制元素</p>`;
    }
  }
  customElements.define('my-custom-element', MyCustomElement);
</script>

<!-- 使用定制元素 -->
<my-custom-element></my-custom-element>

// 使用XPath检索定制元素的值
const xpathResult = document.evaluate('//my-custom-element/p', document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
const node = xpathResult.singleNodeValue;
console.log(node ? node.textContent : '未找到节点');

// 假设元素是在某个事件后添加的
document.addEventListener('DOMContentLoaded', () => {
  // 添加定制元素的代码...
  
  // 确保DOM已更新
  setTimeout(() => {
    const xpathResult = document.evaluate('//my-custom-element/p', document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
    const node = xpathResult.singleNodeValue;
    console.log(node ? node.textContent : '未找到节点');
  }, 0);
});

// 访问Shadow DOM内部的元素
const customElement = document.querySelector('my-custom-element');
const shadowRoot = customElement.shadowRoot;
const xpathResult = shadowRoot.evaluate('//p', shadowRoot, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
const node = xpathResult.singleNodeValue;
console.log(node ? node.textContent : '未找到节点');