ie6 不能 document.createElement('style') 然后append到head标签里。所以就找到这样个好文章

---------------------

有很多提供动态创建 style 节点的方法，但是大多数都仅限于外部的 css 文件。如何能使用程序生成的字符串动态创建 style 节点，我搞了2个小时。

静态外部 css 文件语法：

@import url(style.css);

动态外部 css 文件加载的方法有如下：

第一种：

var style = document.createElement(’link’);
style.href = ’style.css’;

style.rel = ’stylesheet’;

style.type = ‘text/css’;

document.getElementsByTagName(’HEAD’).item(0).appendChild(style);

第二种简单：

document.createStyleSheet(style.css);

动态的 style 节点，使用程序生成的字符串：

var style = document.createElement(’style’);

style.type = ‘text/css’;

style.innerHTML=”body{ background-color:blue; }”;

document.getElementsByTagName(’HEAD’).item(0).appendChild(style);

很遗憾，上面的代码在 ff 里面成功，但是 ie 不支持。从老外论坛得到代码：

var sheet = document.createStyleSheet();

sheet.addRule(’body’,'background-color:red’);

成功，但是很麻烦，要把字符串拆开写，长一点的写死,累的像狗一样。

接着搜，在一个不知道什么国家的什么语言的blog上找到代码：

document.createStyleSheet(”javascript:’body{background-color:blue;’”);

成功，此人实在厉害，但是问题出来了，url 最大 255 个字符，长一点的就不行了，改：

window.style=”body{background-color:blue;”;

document.createStyleSheet(”javascript:style”);

完美解决！！代码:

<html> 

<head> 

<script> 

function blue(){ 

if(document.all){ 

window.style="body{"; 

document.createStyleSheet("javascript:style"); 

}else{ 

var style = document.createElement('style'); 

style.type = 'text/css'; 

style.innerHTML="body{ background-color:blue }"; 

document.getElementsByTagName('HEAD').item(0).appendChild(style); 

} 

} 

</script> 

</head> 

<body> 

<input type="button" value="blue" onclick="blue();"/> 

</body>

原文  http://www.cnblogs.com/stephenykk/archive/2013/06/10/3131231.html

js动态创建style节点(js文件中添加css)的更多相关文章

  1. Javascript动态创建 style 节点

    有很多提供动态创建 style 节点的方法,但是大多数都仅限于外部的 css 文件.如何能使用程序生成的字符串动态创建 style 节点,我搞了2个小时. 静态外部 css 文件语法: @import ...

  2. 利用js动态创建<style>

    var nod = document.createElement(“style”), str = “body{background:#000;color:#fff} a{color:#fff;text ...

  3. js动态创建样式: style 和 link

    js动态创建样式: style 和 link ie6 不能 document.createElement('style') 然后append到head标签里.所以就找到这样个好文章 有很多提供动态创建 ...

  4. ASP.NET在主题中添加CSS文件

    ASP.NET在主题中添加CSS文件 在ASP.NET中,可以使用CSS来控制页面上HTML元素和ASP.NET控件的皮肤.如果在主题文件夹中添加了CSS文件,则在页面应用主题时也会自动应用CSS. ...

  5. UEditor js动态创建和textarea中渲染【原】

    UEditor动态创建和textarea中渲染 http://ueditor.baidu.com/website/examples/textareaDemo.html <!DOCTYPE> ...

  6. JS前端创建CSV或Excel文件并浏览器导出下载

    长期以来,在做文件下载功能的时候都是前端通过ajax把需要生成的文件的内容参数传递给后端,后端通过Java语言将文件生成在服务器,然后返回一个文件下载的连接地址url.前端通过location.hre ...

  7. 通过js动态创建button

    通过js动态创建button 一.实例描述 通过JS的DOM对象,实现元素的动态创建. 二.效果 三.代码 <!DOCTYPE html> <html lang="zh-c ...

  8. js动态创建及移除div的方法

    本文实例讲述了js动态创建及移除div的方法.分享给大家供大家参考.具体实现方法如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 ...

  9. 用JS动态创建登录表单，报了个小错误

    后来发现原来是: dvObj.style.border='#Red 1px sold'; 其中的Red多谢了一个‘#’, 但是奇怪的是在chrome和firefox都备有报错,但是在ie中报错了. 各 ...

随机推荐

  1. GJM : C#语言学习笔记

    --------------------------------------C#--------------------------------------if (tom == null) tom = ...

  2. web项目知识整理

    一.div居中 1.margin:auto 2.left:50%:margin-left:div宽度的一半 二.一般处理程序操作session 引using System.Web.SessionSta ...

  3. JS字符串反序输出

    function IsReverse(text){ return text.split('').reverse().join(''); } IsReverse("你是我的小丫小苹果" ...

  4. 【高级功能】使用 Ajax（续）

    1. 准备向服务器发送数据 Ajax 最常见的一大用途是向服务器发送数据.最典型的情况是从 客户端发送表单数据,即用户在form元素所含的各个 input 元素里输入的值.下面代码展示了一张简单的表单 ...

  5. SharePoint 2013 Excel Services REST API介绍

    前言:Excel Services 中的 REST API 是 Microsoft SharePoint Server 2010 的新增项.利用 REST API,可通过 URL 直接访问工作簿部件或 ...

  6. pod的SDK报错，Linker command failed with exit code1(use -v to see invocation)

    错误1789个重复的符号: 原因是我用cocopads 导入了重复的SDK 环信的SDK EaseMobSDK: 不包含语音的 EaseMobSDKFull: 包含语音的  在Podfile中将导入E ...

  7. iOS之UIApplication详解

    UIApplication对象特点: 特点1: UIApplication对象是应用程序的象征,一个UIApplication对象就代表一个应用程序,而且是单例的.(用来封装整个应用程序的一个对象, ...

  8. 使用logminer挖掘日志，分析历史操作 系列一

    ===============STARTED==================================== 事件起因: 业务的人mail过来说是有张表记录的10K+的优惠码记录没了,要我们确 ...

  9. SQLServer 日期函数大全

    一.统计语句 1.--统计当前[>当天00点以后的数据] ) ) ORDER BY dateandtime DESC 2.--统计本周 3.--统计本月 4.统计当前 SELECT * FROM ...

  10. appdata

    C:/Users/用户名/AppData里面默认有三个文件夹,分别是Local.LocalLow.Roaming,简单地来说,都是用来存放软件的配置文件和临时文件的,里面有很多以软件公司或者软件名称命 ...