动态样式CSS

时间:2022-09-25 21:06:50

<link>标签可以把外部css样式引入HTML页面

<style>元素用于指定嵌入的样式

通过修改link的href属性,改变引入的css样式

function loadStyle(url){
var link = document.createElement('link');
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = url;
var head = document.getElementsByTagName('head')[0];
head.appendChild(link);
}

修改内部css样式通过修改style内部元素完成

<script>
function loadStyleString(css){
var style = document.createElement('style');
var head = document.getElementsByTagName('head')[0];
style.type = 'text/css';
try
{
style.appendChild(document.createTextNode(css));//兼容标准浏览器
}
catch (ex)
{
style.styleSheet.cssText = css;//兼容IE
}
head.appendChild(style);
}
</script>

 cssText容易是浏览器崩溃

动态样式CSS的更多相关文章

  1. 深入理解脚本化CSS系列第五篇——动态样式

    前面的话 很多时候,DOM操作比较简单明了,因此用javascript生成那些通常原本是HTML代码生成的内容并不麻烦.但由于浏览器充斥着隐藏的陷阱和不兼容问题,处理DOM中的某些部分时要复杂一些,比 ...

  2. js中动态载入css js样式

    js中动态载入css样式,方法如下: //<link rel="stylesheet" type="text/css" href="http:/ ...

  3. ASP&period;NET中直接用C&num; 动态修改CSS样式

    ASP.NET中直接用C# 动态修改CSS样式  wonsoft (wonsoft@163.com) 使用JavaScript控制CSS样式有点麻烦,还是觉得直接使用C#操作更方便快捷,本文通过两个B ...

  4. jquery网页换肤&plus;jquery的cookie&plus;动态调用css样式文件&comma;可以的

    比较具有参考性,代码全贴(当然,还需要一张图片需要的留个邮箱,看到就发) 贴在这儿吧,修改一下css的引用位置应该可以用 <%@ page language="java" c ...

  5. JavaScript 动态插入 CSS

    写组件时有时想把一些组件特性相关的 CSS 样式封装在 JS 里,这样更内聚,改起来方便.JS 动态插入 CSS 两个步骤就可以 创建一个 style 对象 使用 stylesheet 的 inser ...

  6. DOM动态脚本和动态样式

    动态脚本 [定义] 在页面加载时不存在,但将来的某一时刻通过修改DOM动态添加的脚本. [方式] [1]插入外部文件方式 var script = document.createElement(&qu ...

  7. Less (一种动态样式语言)

    Less (一种动态样式语言). LESS是一种由Alexis Sellier设计的动态层叠样式表语言,受Sass所影响,同时也影响了 Sass的新语法:SCSS. LESS是开源的,其第一个版本由R ...

  8. Javascript高级编程学习笔记(44)—— 动态样式

    动态样式 动态样式和昨天的动态脚本一样,都是一种动态引入外部样式(脚本的方式) 由于样式是由 link 元素引入的,所以动态样式自然也就是动态生成link元素插入文档的方式 不过和动态脚本不同的是,动 ...

  9. AngularJS动态设置CSS

    使用AngularJS动态设置CSS大致有2种思路: 1.通过动态设置class名称 比如先定义2个样式: .show-true{    display:block;} .show-flase{    ...

随机推荐

  1. SQLServer解析xml到Oracle

    写了一个程序:根据状态位读取SQLserver 中的一张表,下载其中一个字段的值,这个值是XML类型的,然后把这个XML文件的内容插入到另一Oracle数据库,并更新SQLServer表的标志位,表示 ...

  2. css2--collapse

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  3. 指向函数的指针数组(C&plus;&plus;&rpar;

    我们能够创建一个指向函数的指针数组.为了选择一个函数,只需要使用数组的下标,然后间接引用这个指针.这种方式支持表格式驱动码的概念:可以根据状态变量去选择被执行函数,而不用条件语句或case语句.这种设 ...

  4. iOS开发——UI篇Swift篇&amp&semi;UISegmentedControl

    UISegmentedControl override func viewDidLoad() { super.viewDidLoad() titleLabel.text = titleString / ...

  5. CentOS6&period;2下fastDFS的完整安装和配置步骤

    centos6.2系统下安装配置FastDFS步骤: 1:安装libevent(libevent-2.0.16-stable) ##卸载系统自带libevent rpm -qa|grep libeve ...

  6. SGU 230&period; Weighings &lpar;拓扑排序&rpar;

    题意: 给出质量为1~n的n个箱子的m对轻重关系,输出一种可能的箱子的质量排列. Solution: 拓扑排序,注意要处理重边. #include <iostream> #include ...

  7. C&plus;&plus;类成员常量

    由于#define 定义的宏常量是全局的,不能达到目的,于是想当然地觉得应该用const 修饰数据成员来实现.const 数据成员的确是存在的,但其含义却不是我们所期望的.const 数据成员只在某个 ...

  8. U5首次登录

    1.在Llinx中,大小写字母是不一样的东西. 2.date可以查看日期,date的正确格式是:date +%Y/%m/%d/%H/%M(左边这句话所想表达的意思是年的字母必须为大写,月的必须为小写. ...

  9. Ransom Note(383)

    题目:Given an arbitrary ransom note string and another string containing letters from all the magazine ...

  10. ASP&period;NET Core SignalR中的流式传输

    什么是流式传输? 流式传输是这一种以稳定持续流的形式传输数据的技术. 流式传输的使用场景 有些场景中,服务器返回的数据量较大,等待时间较长,客户端不得不等待服务器返回所有数据后,再进行相应的操作.这时 ...