`

Js动态添加样式

阅读更多
<script type="text/javascript">
//添加页面样式
function addStyle(content)
{
    var style;
    if(document.all)    //IE
    {
        style = document.createStyleSheet();
        style.cssText = content;
    }
    else
    {
        style = document.createElement("style"); 
        style.type = "text/css"; 
        //style.innerHTML = content;//Safari、Chrome 下innerHTML只读
        style.textContent = content;
    }
    try{document.getElementsByTagName("head")[0].appendChild(style);}catch(e){}//IE Error:不支持此接口
}
//添加外部样式
function includeStyle(url)
{
    var style = document.createElement("link");
    style.type = "text/css";
    style.setAttribute("rel","stylesheet");
    style.setAttribute("href",url);
    document.getElementsByTagName("head")[0].appendChild(style);
}
addStyle("#div1{background-color:#CC99FF;width:200px;height:100px;}");
includeStyle("http://www.mzwu.com/style/global.css");
</script>

分享到:
评论

相关推荐

    再谈javascript 动态添加样式规则 W3C校检

    JavaScript 动态添加样式规则是前端开发中一种常见的技术,特别是在需要实时调整元素样式或创建交互效果时。本文将深入探讨如何使用JavaScript来动态添加、修改和管理样式规则,并确保这些规则符合W3C标准。 首先,...

    js添加css样式小技巧

    - 在IE浏览器中动态添加样式表。 #### 四、处理iframe中的样式 在处理`iframe`内的样式时,需要注意以下几点: **1. 创建iframe** ```javascript var iframe = document.createElement('iframe'); ``` **...

    JavaScript动态添加css样式和script标签

    - 动态添加样式和脚本是DOM操作中的常见需求,可以通过创建link和script元素节点,并利用appendChild等方法将这些节点添加到DOM树中相应的位置。 4. 动态添加内容的场景与优势 - 动态添加CSS和JavaScript可以实现...

    javascript动态添加样式(行内式/嵌入式/外链式等规则)

    添加CSS的方式有行内式、嵌入式、外链式、导入式 a)动态引入样式表文件: 代码如下: function loadLink(url){ var link = document.createElement(“link”); link.type = “text/css”; link.rel = “stylesheet”;...

    通过JS动态向网页中添加CSS样式语句代码

    在网页开发中,JavaScript(JS)是一种不可或缺的脚本语言,它允许我们与用户交互、处理数据、控制页面行为,包括动态地向网页中添加CSS样式。本文将深入探讨如何通过JS来动态创建和应用CSS样式,以及如何利用AJAX...

    js动态条目添加

    在提供的文件列表中,`index.html`包含网页的基本结构,`css`文件夹可能包含项目的样式规则,`images`用于存放与项目相关的图像资源,而`js`文件夹则可能包含实现动态条目添加功能的JavaScript代码。实际开发中,这...

    javascript 动态样式添加的简单实现

    总的来说,JavaScript动态样式添加是一种强大的技术,它可以让你在不刷新整个页面的情况下更新或添加样式,提高网页的响应性和性能。无论是加载外部CSS文件还是内联CSS模块,都能帮助你更有效地管理网页的样式表现。

    JS动态添加tr

    一、JS动态添加`&lt;tr&gt;` 在HTML中,`&lt;table&gt;`元素用于创建表格,而`&lt;tr&gt;`元素代表表格的一行。在JavaScript中,我们可以通过DOM(Document Object Model)操作来动态地向表格中添加新的行。以下是一个基本的示例: ``...

    微信小程序点击view动态添加样式过程解析

    微信小程序点击view动态添加样式主要涉及微信小程序的基础知识,包括微信小程序的视图组件view、数据绑定、事件处理以及样式控制等内容。以下是对这个过程的详细解析: 1. **自定义dataIndex属性**:在微信小程序中...

    spreadjs_动态添加表头及数据绑定-demo.zip

    标题“spreadjs_动态添加表头及数据绑定-demo.zip”所指的,是使用SpreadJS库创建的一个示例,该示例演示了如何在JavaScript环境中动态地添加表格表头并实现数据绑定。SpreadJS是一款强大的JavaScript电子表格组件,...

    动态添加css或js链接

    ### 动态添加CSS或JS链接 在Web开发过程中,我们经常会遇到需要动态加载样式表(CSS)或脚本(JavaScript)的情况。这种方式不仅能够提高页面的加载速度,还可以实现更加灵活的功能。本文将详细介绍如何在ASP.NET ...

    用js实现的动态添加一行

    这个“用js实现的动态添加一行”的实践项目是针对AJAX和JavaScript技术的一个基础练习,它旨在帮助开发者掌握如何在不刷新页面的情况下更新DOM(Document Object Model)并实现异步通信。 首先,让我们深入了解一下...

    JS动态添加文本框.html

    JS动态添加文本框.html DEMO实例。

    vue鼠标移入添加class样式,鼠标移出去除样式(active)实现方法

    首先,要在Vue组件中实现鼠标移入移出的class样式动态变化,我们通常会使用Vue的指令(Directives)来绑定事件。在本例中,使用了`v-on`指令(简写为`@`)来监听`mouseover`(鼠标移入)和`mouseout`(鼠标移出)...

    js的各种样式的菜单

    总的来说,"js的各种样式的菜单"这个主题涵盖了JavaScript在创建动态、交互式菜单方面的广泛应用。开发者可以根据项目需求选择合适的技术和设计,创造出既美观又实用的菜单系统,提升用户在Web应用中的导航体验。...

    JS改变元素样式

    在JavaScript(JS)中改变元素样式是Web开发中常见的任务,它允许动态更新网页的外观和行为。通过JavaScript,我们可以响应用户的交互、响应数据变化或实现动态效果。本篇文章将详细探讨如何使用JavaScript来操作...

Global site tag (gtag.js) - Google Analytics