angular:HtmlElement的子节点有Shadow dom时奇怪的现象

描述:

这样写时,会自动跳过shadow dom节点的遍历

TypeScript 复制代码
const cloneElement = this.contentElement.cloneNode(true) as HTMLElement;
for(let childNodeIndex = 0; childNodeIndex < cloneElement.childNodes.length; childNodeIndex++) {
    element.appendChild(cloneElement.childNodes[childNodeIndex] as HTMLElement);
}

或者使用cloneElement.childNodes.forEach遍历,也不会遍历到shadow dom节点

如果这样写:

会在appendChild shadow dom节点报错,提示不是一个HtmlElement,无法append

TypeScript 复制代码
const cloneElement = this.contentElement.cloneNode(true) as HTMLElement;
const childCount = cloneElement.childNodes.length;
for(let childNodeIndex = 0; childNodeIndex < childCount; childNodeIndex++) {
    element.appendChild(cloneElement.childNodes[childNodeIndex] as HTMLElement);
}
相关推荐
OpenTiny社区5 分钟前
“Performance面板”一文通,解锁前端性能优化工具基础用法!
前端·javascript·性能优化
盏灯9 分钟前
💭单点登录, 用户状态到底存session还是cookie还是jwt?
前端
泉城老铁10 分钟前
在 Element UI 中将 el-radio-group改为纵向排列
前端·vue.js
Ratten12 分钟前
【CSS】---- CSS 实现超过固定高度后出现展开折叠按钮
前端
用户500937683903915 分钟前
基于Electron的Web打印解决方案:web-print-pdf技术分享
前端
书中曾有的故事_15 分钟前
mcp-faker-json
前端·mcp
Ratten16 分钟前
【CSS】---- CSS 变量,实现样式和动画函数复用
前端
前端开发呀18 分钟前
关于vite项目中可能存在的前端资源加载报错
前端·vite
写个西瓜代码26 分钟前
一文搞懂 React Hooks:写代码像聊天一样轻松!
前端
用户17495805607228 分钟前
react router 的action之前的传统表单提交方式
前端