动态创建样式表在各浏览器中的差异测试代码

代码如下:

<!doctype html>
<head></head>
<body>
<span id="con">xxx</span>
<script>
var css = document.createElement('style');
css.setAttribute('type', 'text/css');
var cssText = 'span{color:Red;}';
if(css.styleSheet) { // IE
css.styleSheet.cssText = cssText
} else {
css.appendChild(document.createTextNode(cssText));
}
document.getElementsByTagName("head")[0].appendChild(css);
</script>

对于标准浏览器，直接使用css.innerHTML也可以修改HTMLStyleElement的css规则；
但是对于IE会导致一个“unknow runtime error”。

赞 (0)

相关推荐

  • 动态创建样式表在各浏览器中的差异测试代码

    复制代码 代码如下: <!doctype html> <head></head> <body> <span id="con">xxx</span> <script> var css = document.createElement('style'); css.setAttribute('type', 'text/css'); var cssText = 'span{color:Red;}'; if(cs

  • java使用JDBC动态创建数据表及SQL预处理的方法

    本文实例讲述了java使用JDBC动态创建数据表及SQL预处理的方法.分享给大家供大家参考,具体如下: 这两天由于公司的需求,客户需要自定义数据表的字段,导致每张表的字段都不是固定的而且很难有一个通用的模板去维护,所以就使用JDBC动态去创建数据表,然后通过表的字段动态添加数据,数据的来源主要是用户提供的Excel直接导入到数据库中. 如果考虑到字段的类型,可以通过反射的机制去获取,现在主要用户需求就是将数据导入到数据库提供查询功能,不能修改,所以就直接都使用String类型来处理数据更加便捷.

  • JavaScript动态创建form表单并提交的实现方法

    本文实例讲述了JavaScript动态创建form表单并提交的实现方法.分享给大家供大家参考,具体如下: 页面布局有些复杂的情况下,可能需要在页面中动态创建一个 form,JavaScript 创建 form 演示如下: // JavaScript 构建一个 form function MakeForm() { // 创建一个 form var form1 = document.createElement("form"); form1.id = "form1"; f

  • asp.net在后端动态添加样式表调用的方法

    本文实例讲述了asp.net在后端动态添加样式表调用的方法.分享给大家供大家参考.具体实现方法如下: HtmlLink CssControl = new HtmlLink(); CssControl.Href = url; CssControl.Attributes.Add("rel", "stylesheet"); CssControl.Attributes.Add("type", "text/css"); page.Hea

  • 元素的内联事件处理函数的特殊作用域在各浏览器中存在差异

    标准参考 无. 问题描述 在一个元素的属性中绑定事件,实际上就创建了一个内联事件处理函数(如<h1 onclick="alert(this);"...>...</h1>),内联事件处理函数有其特殊的作用域链,并且各浏览器的实现细节也有差异. 造成的影响 如果在元素的内联事件处理函数中使用的变量或调用的方法不当,将导致脚本运行出错. 受影响的浏览器 所有浏览器 问题分析 1. 内联事件处理函数的作用域链 与其他函数不同,内联事件处理函数的作用域链从头部开始依次是:

  • 用JS提交参数创建form表单在FireFox中遇到的问题

    在一个前端页面上,需要通过JavaScript来提交参数,使用JS创建form表单,将参数append到表单中进行提交,代码如下: Js代码: 复制代码 代码如下: functionloadConfig(gameUrl,skinId){ vartemp=document.createElement("form"); temp.action="${createLink(controller:'mobileConfig',action:'beforeLaunchConfig')}

  • asp.net 动态引用样式表代码

    1. 添加CSS样式: Style style = new Style(); style.ForeColor = System.Drawing.Color.Navy; style.BackColor = System.Drawing.Color.LightGray; this.Header.StyleSheet.CreateStyleRule(style, null, "body"); 2. 链接外部的CSS样式表: HtmlLink link = new HtmlLink(); li

  • asp.net  动态引用样式表代码

    1. 添加CSS样式: Style style = new Style(); style.ForeColor = System.Drawing.Color.Navy; style.BackColor = System.Drawing.Color.LightGray; this.Header.StyleSheet.CreateStyleRule(style, null, "body"); 2. 链接外部的CSS样式表: HtmlLink link = new HtmlLink(); li

  • 事件模型在各浏览器中存在差异

    事件模型在各浏览器中存在差异

    标准参考 根据 W3C DOM 2 Events 描述,EventTarget 接口被所有支持 DOM 事件模型的节点(Node)实现. 该接口提供了 'addEventListener' 和 'removeEventListener' 方法,用来绑定或解绑一个 EventListeners 接口到一个 EventTarget. DOM 2 Events 中定义了 Event 接口,用来提供事件的上下文信息,它提供了若干标准属性和方法. 实现 Event 接口的对象一般作为第一个参数传入事件处理

  • jQuery获取浏览器中的分辨率实现代码

    复制代码 代码如下: <script type="text/javascript"> $(document).ready(function(){ alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度 alert($(document.body).height());//浏览器当前窗口文档body的高度 alert($(document.body).oute

随机推荐