关于读style元素定义样式表兼容性

<span style="font-size:18px;"></span><pre name="code" class="javascript"><html>
<head>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
        <title>JavaScript Sample</title>
<style type="text/css">
div{color:#FF0000;font-weight:bold;}
p{color:#000000;font-size: 14px;}
</style>
</head>
<body>
<div id="div1">请点击<a href="#">站点链接</a>
</div>
<script type="text/javascript">
    var o = document.styleSheets[0];
    var ol = o.rules[1];
    alert(ol.style.color);
    ol.style.color ="green";
    alert(ol.style.color);
</script>
</body>
</html>


在測试上述代码的时候，在Google和IE中可以正常执行，下面是google中的执行截图：




watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMTA0Mzg0Mw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" >




可是，放在FF（火狐 29）中确不能执行。没有弹框，出现例如以下错误：




rules方法在FF中是未定义的，所以将rules方法换成了cssRules()方法。就能正常执行：






cssRules()在Google和IE中国支持。


版权声明：本文博客原创文章，博客，未经同意，不得转载。
				


				
时间： 2024-10-19 15:37:17 

		


		


	

	
	

		


		
关于读style元素定义样式表兼容性的相关文章


								

		

			

                [2016-01-16][CSS][定义样式表(样式选择器)]
			

		

		

									

				Class 定义:.classname{ 属性:属性值;} 使用:<p class = "classname"></p> ID 定义: #IDNUM{ 属性:属性值; } 使用:<p id = "IDNUM"></p> 组合选择器 定义:标记1,标记2...标记n{属性:属性值;} 使用:直接正常使用上面存在标记即可 伪选择器 calss的使用 ID的使用 组合选择器h1 h2 h3 伪选择器 1 2 3 4 5 6			

		

	

				

		

			

                CSS层叠样式表——定义样式表
			

		

		

									

				定义样式表 1  HTML标记定义 <p>...</p> p{属性:属性值:属性1:属性值1} p可以叫做选择器,定义那个标记中的内容执行其中的样式 一个选择器可以控制若干个样式属性,他们之间需要用英语";"隔开,最后一个可以不应加 2  Class定义 <p class="p">...</p> class定义是以"."开始 .p{属性:属性值:属性1:属性值1} 3  ID 定义 <p id			

		

	

				

		

			

                表单的元素和样式表
			

		

		

									

				<body><form action="ae.html" method="post"><input type="text" name="gandong" value="hello"/><input type="password" name="gandong value="1234"/><input typ			

		

	

				

		

			

                css折叠样式（2）——定义样式表
			

		

		

									

				第一样式表可用(1)嵌入式样式表(2)引入式样式表,两种方式来实现, 如下我便以代码的形式放在下面: (1)嵌入式样式表 demo.html <!doctype html> <html> <head>     <meta charset="utf-8">     <title>CSS样式使用</title>     <style type="text/css">         di			

		

	

				

		

			

                jquery给元素添加样式表的方法
			

		

		

									

				//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#two").attr("class","divClass")设置Id为two的class属性. //2.追加样式 $("#two").addClass("divClass2")为ID为two的对象追加样式divClass2 //3.移除样式 $("			

		

	

				

		

			

                css常用元素通用样式表
			

		

		

									

				@charset "utf-8";html,body,a,h1,h2,h3,h4,h5,h6,p,a,b,i,em,s,u,dl,dt,dd,ul,ol,li,strong,span,table,th,tr,td,img,div,form,fieldset,legend,input,button,select,option,textarea,label,iframe { margin: 0; padding:0}a{ text-decoration: none;}ol,ul,li{ l			

		

	

				

		

			

                JavaScript 使用DOM操纵样式表
			

		

		

									

				一 操作表格 <table>标签是HTML中结构最为复杂的一个,我们可以通过DOM来创建生成它,或者HTMLDOM来操作它; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 // 使用DOM来创建表格; var table = document.createElement('table'); table.border = 1; table.width = 300; var caption = document.cre			

		

	

				

		

			

                css概述、css样式表分类、选择器分类、css基础样式
			

		

		

									

				1 . 样式表  Cascading Style Sheet css优势: 内容与表现分离 网页的表现统一,容易修改 丰富的样式,使网页布局更加灵活 减少网页代码量,增加网页的浏览速度,节省网络带宽 使用独立于网页的CSS,有利于网页被搜索引擎收录 嵌入ID>外部ID>嵌入class>外部class>嵌入标签>外部标签     1.1  引入方式 四种 style=""  行内样式表 <style>   内部样式表 <link rel=&			

		

	

				

		

			

                【温故而知新-Javascript】为DOM元素设置样式
			

		

		

									

				1. 使用样式表 可以通过document.styleSheets属性访问文档中可用的CSS样式表,它会返回一组对象集合,这些对象代表了与文档管理的各个样式表. 每个样式表 都由一个CSSStyleSheet 对象代表,它提供了一组属性和方法来操作文档里的样式. 1.1 获得样式表的基本信息 第一步是获得定义在文档中的样式表的一些基本信息. <!DOCTYPE html> <html lang="en"> <head> <meta charse