CSS样式动态样式方法封装（兼容IE）

最新推荐文章于 2024-08-19 08:00:00 发布

丞象

最新推荐文章于 2024-08-19 08:00:00 发布

阅读量380

点赞数

文章标签： css javascript

本文链接：https://blog.csdn.net/King_Forward/article/details/109019083

版权

<script>
        // 加载样式函数（兼容 IE）
        function loadStyleString(css) {
            var style = document.createElement('style')
            style.type = 'text/css'
            try{
                // IE 中会把 style 视为一个特殊的节点，不允许访问其子节点
                style.appendChild(document.createTextNode(css))
            } catch (ex) {
                // 解决办法：通过访问元素的 styleSheet 属性，该属性又有一个 cssText 属性可以接受 CSS 代码
                style.styleSheet.cssText = css
            }
            var head = document.getElementsByTagName('head')[0]
            head.appendChild(style)
        }
        /*
            注意：如果专门针对 IE 编写代码，务必小心使用 styleSheet.cssText 属性。
            在重用同一个<style>元素并再次设置这个属性时，有可能会导致浏览器崩溃
            同样，将 cssText 属性设置为空字符串也可能导致浏览器崩溃
        */
    </script>