Javascript动态创建Style节点 第一种：
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 个字符，长一点的就不行了，经过 SXPCrazy 提示，改成：
window.style=”body{background-color:blue;”;
document.createStyleSheet(”javascript:style”);
完美解决！！代码:
<html>
<head>
<script>
function blue(){
if(document.all){
window.style="body{background-color:blue;";
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>
</html>
分享到：
相关推荐
JavaScript、CSS（层叠样式表）是Web开发中的两个核心组成部分，它们共同决定了网页的动态交互性和视觉表现。本文将深入探讨这两个领域的基础知识及其在实际应用中的重要性。 JavaScript，全称ECMAScript，是一种...
本教程主要探讨如何使用JavaScript实现网页中的动态图片切换效果，让页面更加生动有趣。 首先，我们需要理解图片切换的基本原理。通常，我们可以创建一个包含多张图片的数组，并利用定时器（setTimeout 或 ...
在这个"Java Script特效网页制作"的主题中，我们将深入探讨如何利用JavaScript为网页增添动态效果，提升用户体验。 首先，JavaScript的核心在于它的事件驱动特性，通过监听用户的交互行为，如点击、滚动、输入等，...
"国外Java Script经典封装"这个主题聚焦于那些由国外开发者精心编写的JavaScript库和工具，它们不仅在功能上表现出色，而且在兼容性方面做得很好，确保在Firefox（FF）和Opera等主流浏览器中都能正常运行。...
5. **CSS操作**：JavaScript可以访问和修改网页的样式，例如动态更改颜色、大小或位置，实现更复杂的动画效果。 6. **浏览器兼容性**：JavaScript在不同的浏览器上可能有不同的行为，因此了解如何使用polyfill或者...
**AJAX** (Asynchronous JavaScript and XML) 是一种创建动态网页的技术，允许在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容。通过XMLHttpRequest对象，JavaScript可以异步发送HTTP请求，获取...
在"Java Script 经典教程（五）——JavaScript几段特效"中，我们将深入探讨如何利用JavaScript为网页添加各种动态效果，提升用户体验。 1. **DOM操作**：DOM（Document Object Model）是HTML或XML文档的结构化表示...
3. **CSS样式操作**：JavaScript可以直接修改元素的CSS样式，实现动态改变颜色、大小、位置等效果，创造出丰富的视觉动画。 4. **定时器与延迟执行**：`setTimeout`和`setInterval`函数可以实现定时执行任务，常...
在Ajax应用中，CSS用于美化动态加载的内容，确保更新的元素与原有页面风格一致。 **XML** XML（Extensible Markup Language）是一种用于存储和传输数据的标记语言，结构严谨且可扩展。在Ajax中，XML有时被用来作为...
2. 动态内容生成：JavaScript可以创建新的HTML元素，或者改变现有元素的属性和内容，实现动态加载。 3. 表单验证：JavaScript可以在客户端对用户输入进行验证，提高用户体验和服务器性能。 4. CSS操作：JavaScript...
这种时钟通常采用HTML作为结构基础，CSS进行样式设计，而JavaScript负责动态更新时间信息。下面我们将深入探讨这个主题，包括JavaScript的基础知识、2D时钟的工作原理以及如何实现一个简单的2D时钟。 1. JavaScript...
"Java Script各类特效大全"涵盖了JavaScript在网页开发中的各种应用，包括但不限于以下几大类： 1. 图片特效：JavaScript可以实现图片的动态加载、轮播、缩放、旋转、淡入淡出等效果。例如，可以使用JavaScript创建...
Java是一种静态类型的、编译式的、类基于的、面向对象的语言，而JavaScript则是动态类型、解释执行的、基于原型的语言。 JavaScript的主要应用场景包括： 1. **网页交互**：通过DOM（Document Object Model）操作...
JavaScript，不应当与Java混淆，是一种广泛应用于网页和网络应用的编程语言，尤其在前端开发中起着至关重要的作用。它允许开发者实现动态内容，提升用户体验，如交互式表单、动画效果、网页数据处理等。 教程可能...
JSP（JavaServer Pages）是一种动态网页技术，它允许开发者将静态HTML内容与Java代码结合，以创建交互式的网页应用。在Servlet处理完业务逻辑后，JSP用于生成动态内容并展示给用户。JSP页面中可以包含HTML、CSS、...
教程可能涵盖HTML与CSS的结合、DOM操作（增删改查元素）、AJAX（异步JavaScript和XML）以实现页面与服务器的通信、表单验证、时间与日期处理、动画效果创建等内容。同时，可能还会介绍一些常见的JavaScript库和框架...
JavaScript特效在网页开发中扮演着重要的角色，尤其在构建交互式和动态用户界面时。树型菜单是一种常见的UI元素，它允许用户以层次结构浏览和选择数据。在本篇文章中，我们将深入探讨如何使用JavaScript来实现这样的...
这可能包括创建新的元素，绑定事件监听器，以及根据数据模型动态更新元素状态。 3. **事件处理**：JavaScript Tree 库会监听用户的交互事件，如点击、拖放等，并相应地更新树的状态。这涉及到了事件委托和事件冒泡...