Question

所以我有这个代码：

const extendCSS = (el1, el2) =>{
  Array.prototype.slice.call(document.querySelector(el1).attributes).forEach(function(item) {
    el2.setAttribute(item.name, item.value);
  });
}
const build = (elementType) => tag => {
  const query = document.querySelectorAll(tag);
  query.forEach(ptag => {
    const shadow = ptag.attachShadow({
      mode: 'open'
    });
    const element = document.createElement(elementType);
    element.innerHTML = ptag.innerHTML;
    extendCSS(tag, element);
    element.setAttribute('id', tag);
    shadow.host.parentNode.replaceChild(element, shadow.host);
  });
};
const h1 = build('h1');
const textarea = build('textarea');
textarea("text-editor");
h1("text-value");

const texteditor = document.querySelector('#text-editor');
const textvalue = document.querySelector('#text-value');
texteditor.addEventListener('keydown', ()=>{
textvalue.innerHTML = texteditor.value;
});

<text-editor></text-editor>
<text-value></text-value>

此build()做一件事：-选择自定义元素，更改其标签类型，并分配自定义标签名称的ID，然后将其替换为所需的内容。这里工作正常。但是，如果我将构建函数之后的所有内容都编写在一个外部.js文件中，然后将其绑定到html并运行它，那么它将无法正常工作。我该如何解决？目前这是非常重要的。帮助和答案表示赞赏。预先感谢。

自定义元素上的querySelector在外部文件中不起作用

0 个答案: