无刷新更换页面样式

原创 2007年09月13日 22:33:00

本文只是实现无刷新更改页面样式的一个例子,具体现实中如有问题,可以查询MSDN获取帮助.

要改成页面样式,第一步理解样式文件的加载原理,即新加载在后面的同名样式将自动覆盖原来的同名样式,比如说

body{font:size:10px;backgroup:url(../images/aa.img)repeat top center}这个样式的作用是给背景加上一个图片,图片平铺,然而当页面中在这之后加上一个样式body{backgroup-reapt:noreapt;}这样虽然你的页面中有两个同名的样式,但对背景图片的重复会变成不自动平铺了。

要设置成JS无刷新更改页面样式,可以通过增加一个样式文件(跟原页面的样式结构一样,具体内容不一样),来更改原来页面的样式,代码如下:

var links=document.CreateElements("link");

link.type="text/style";

link.href="other.css";

document.getElementsByTagName("head")[0].AppenChild(link);

这样就可以了。

另一种方法:就是在更改页面中某一部分的样式时,直接通过document.CreateElement("Style")元素来实现。

注意:使用document.CreateElement("Style")时,IE中通过StyleSheet.Text来实现CSS内容的书写,FireFox等浏览器通过增加一个TextNode,然后将样式给其InnerHTML来实现。

刷新页面更换CSS样式表-对网上document.write方式的修正

无意中看到了这样一篇博客刷新页面更换CSS样式表,所以想动手试试能不能满足结果,结果可想而知 var cssname=Math.floor(Math.random()*2+1); documen...

Dom2(页面加载事件,标签样式,刷新)

主要有3种: 第一种:onload 页面加载完毕时触发,浏览器是一边下载文档,一边解析执行,可能会出现会出现JavaScript执行时需要操作的参数还没有加载.如果这样,就要把操作的文档放到bod...
  • xbc1213
  • xbc1213
  • 2016年01月21日 15:29
  • 191

asp.net 页面刷新后样式改变,解决方法

using System; using System.Collections.Generic; using System.Text; using System.Web; using Syste...

jQuery Mobile动态刷新页面样式

来源:http://blog.csdn.net/zht666/article/details/8560765 当我们使用Ajax或者javascript动态在页面上添加元素后,如添加...

jQuery Mobile动态刷新页面样式

见 百度经验 http://jingyan.baidu.com/article/7f766dafbc18f24101e1d014.html

jQuery Mobile动态刷新页面样式

当我们使用Ajax或者javascript动态在页面上添加元素后,如添加select控件的option元素,添加ul的li元素。添加之后我们会发现,它们显示的样式不是jQuery Mobile的炫酷样...
  • zht666
  • zht666
  • 2013年01月31日 19:15
  • 37973

jQuery Mobile动态刷新页面样式

当我们使用Ajax或者javascript动态在页面上添加元素后,如添加select控件的option元素,添加ul的li元素。添加之后我们会发现,它们显示的样式不是jQuery Mobile的炫酷样...

jQuery Mobile动态刷新页面样式

当我们使用Ajax或者javascript动态在页面上添加元素后,如添加select控件的option元素,添加ul的li元素。添加之后我们会发现,它们显示的样式不是jQuery Mobile的炫酷样...

jquery怎么实现页面刷新后保留鼠标点击addclass的样式

原文: 感谢所以回答问题的人。 比较好的办法是使用url传参数,然后根据参数判断是否有必要显示class 但是更好的办法是下面这段JS $('ul.main-menu li a')....
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:无刷新更换页面样式
举报原因:
原因补充:

(最多只允许输入30个字)