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);
}
相关推荐
美摄科技13 小时前
H5短视频SDK,赋能Web端视频创作革命
前端·音视频
七号练习生.c13 小时前
JavaScript基础入门
开发语言·javascript·ecmascript
黄毛火烧雪下13 小时前
React Native (RN)项目在web、Android和IOS上运行
android·前端·react native
fruge13 小时前
前端正则表达式实战合集:表单验证与字符串处理高频场景
前端·正则表达式
baozj13 小时前
🚀 手动改 500 个文件?不存在的!我用 AST 撸了个 Vue 国际化神器
前端·javascript·vue.js
用户40993225021213 小时前
为什么Vue 3的计算属性能解决模板臃肿、性能优化和双向同步三大痛点?
前端·ai编程·trae
海云前端113 小时前
Vue首屏加速秘籍 组件按需加载真能省一半时间
前端
蛋仔聊测试13 小时前
Playwright 中route 方法模拟测试数据(Mocking)详解
前端·python·测试
零号机14 小时前
使用TRAE 30分钟极速开发一款划词中英互译浏览器插件
前端·人工智能
molly cheung14 小时前
FetchAPI 请求流式数据 基本用法
javascript·fetch·请求取消·流式·流式数据·流式请求取消