个人理解无界原理

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Document</title>

</head>

<style>

#acb{

color: green;

}

.aaa{

color: red;

}

</style>

<body>

<div id="acb">22</div>

<div id="shadown">

<!-- <wujie-app></wujie-app> -->

</div>

</body>

<script>

const host = document.querySelector("#shadown");

const shadow = host.attachShadow({ mode: "open" });

const aa = document.createElement("wujie-app")

shadow.appendChild(aa)

class MyCustomElement extends HTMLElement {

constructor() {

super();

//const s = document.getElementById("tem")

const ht = document.createElement("html")

const bo = document.createElement('body')

const div = document.createElement("div")

div.innerHTML = 111112222

div.id='acb'

bo.appendChild(div)

ht.appendChild(bo)

this.appendChild(ht)

// 在这里可以进行元素的初始化操作,比如添加内容、样式等

}

}

customElements.define('wujie-app', MyCustomElement);

</script>

</html>

相关推荐
陪我去看海15 小时前
被要求猛出小程序,做了这个多平台多环境的部署替我承受压力
前端·微信小程序·抖音小程序
Frag0ut15 小时前
告别插件时代:HTML5 视频播放对比 Flash/Silverlight/ActiveX 的性能与技术优势解析
前端·html5·视频播放·flash·activex·流媒体技术·silverlight
用户8186180280015 小时前
MongoDB文档模型设计——从建模到索引
前端
周杰伦fans15 小时前
构建真正智能的CAD AI绘图代理
开发语言·人工智能·c#
無名路人16 小时前
小程序点餐页吸顶滚动之分类按需加载,上划切换
前端·vue.js·微信小程序
竹林81816 小时前
把神经网络塞进一个浏览器标签页:端侧视觉 AI 的工程真相
前端·浏览器
乘风gg17 小时前
别跟风 AI 副业,工程师最该学的是 AI Coding
前端·ai编程·claude
Frag0ut17 小时前
深度解析:Chrome 自启动与后台常驻服务的作用、关闭方法及利弊权衡
前端·chrome
OpsEye17 小时前
当企业不再只关心能不能调用模型,而是关心值不值得调用
javascript·ai编程
Amos_Web17 小时前
Rspack 源码解析(十五):Loader Runner 与 JS Loader 桥接
前端·rust·前端框架