JavaScript动态插入CSS的方法(js动态添加trtd)

编辑：rootadmin

推荐整理分享JavaScript动态插入CSS的方法(js动态添加trtd)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:javascript动态加载,js中怎么实现动态添加元素,js动态添加html,javascript动态加载,js中怎么实现动态添加元素,js中怎么实现动态添加元素,js动态添加img,js中怎么实现动态添加元素,内容如对您有帮助，希望把文章链接给更多的朋友！

写组件时有时想把一些组件特性相关的 CSS 样式封装在 JS 里，这样更内聚，改起来方便。JS 动态插入 CSS 两个步骤:创建1、一个 style 对象2、使用 stylesheet 的 insertRule 或 addRule 方法添加样式

一、查看样式表

先看下 document.styleSheets，随意打开一个页面

其中前三个是通过 link 标签引入的 CSS 文件，第四个是通过 style 标签内联在页面里的 CSS。有如下属性

每一个 cssRule 又有如下属性

其中的 cssText 正是写在 style 的源码。

二、动态插入 CSS首先，需要创建一个 style 对象，返回其 stylesheet 对象

添加函数 addCssRule 如下

需要注意，标准浏览器支持 insertRule， IE低版本则支持 addRule。完整代码如下

如果只支持移动端或现代浏览器，可以去掉低版本IE判断的代码

本文链接地址:https://www.jiuchutong.com/biancheng/387183.html 转载请保留说明！