CSS样式表3种方式:

内嵌:写在html标签中的样式 ;如:<p style="width:100px"> 内嵌</p>

内联:写在html 中<head></head>之间的样式表

    <head>

      <style>

      </style>

    </head>

外联:通过<head>标签中的<link >标签中链接的css样式表

js对内嵌操纵:

  <p style="width:100px" id="p"> 内嵌</p>

  var p=document.getElementById("p");

  p.style.width="200px";

  将p标签的宽度改为了200px;

js操作内联样式:

<script type="text/javascript">

方法一:

function getStyle(selector, attr) {
for(i = 0, len = document.styleSheets.length; i < len; i++) {
var rules;
if(document.styleSheets[i].rules) {
/*for ie*/ 
rules = document.styleSheets[i].rules;
} else {
/*for 非ie*/
rules = document.styleSheets[i].cssRules;
}
for(j = 0, rlen = rules.length; j < rlen; j++) {
if(rules[j].selectorText == selector) {
alert(rules[j].style[attr]);
}
}
}
}

</script>

方法二:

<script type="text/javascript">

IE:elementObj.currentStyle

w3c标准:window.getComputedStyle(elementObj, null)  或 document.defaultView.getComputedStyle(elementObj, null )

document.defaultView.getComputedStyle?document.defaultView.getComputedStyle(id,null).getPropertyValue("background-color"):id.currentStyle["backgroundColor"];

</scirpt>

  

JavaScript对css样式表操作的更多相关文章

  1. javascript修改css样式表

    //创建var sheet=document.createElement('style');document.bodt.appendChild(sheet);sheet.styleSheet.cssT ...

  2. JavaScript访问修改css样式表

    1.访问元素中style属性的css样式 可以根据属性的ID或name标签利用dom操作直接访问到内部的css样式,直接使用style对象访问 <div id="myid" ...

  3. JavaScript 客户端JavaScript之样式表操作(DOM API 提供模块之一)

    层叠样式 表和动态HTML   层叠样式表(CSS)是指定HTML文档或XML文档的表现的标准.     使用CSS和Javascript,可以创建出各种视觉效果,这些效果可以统称为动态HTML(DH ...

  4. DOM与CSS样式表

    在前文 <DOM与元素节点内联样式>中我们了解了用 DOM 提供的接口操作元素节点内联样式的方法,今天我们来学习一下如何用 DOM 操作 CSS 样式表. CSS 样式表概况 通过使用 H ...

  5. CSS样式表、JS脚本加载顺序与SpringMVC在URL路径中传参数与SpringMVC 拦截器

    CSS样式表和JS脚本加载顺序 Css样式表文件要在<head>中先加载,这样网页显示时可以第一次就渲染出正确的布局和样式,网页就不会闪烁,或跳变 JS脚本尽可能放在<body> ...

  6. 美丽的表格样式(使用CSS样式表控制表格样式)

    按照WEB2.0风格,设计了几个表格样式,希望大家喜欢. WEB2.0提倡使用div开布局,但不是要全然放弃使用表格,表格在数据展现方面还是不错的选择. 如今使用介绍使用CSS样式表来控制.美化表格的 ...

  7. 漂亮的表格样式(使用CSS样式表控制表格样式)

    根据WEB2.0风格,设计了几个表格样式,我希望你喜欢. WEB2.0推广使用div开放式布局.但并不是完全放弃使用形式,在数据表现形式而言是一个不错的选择. 本节将介绍如何使用现在CSS样式表来控制 ...

  8. 久未更 ~ 五之 —— 引入外部CSS样式表 小节

    > > > > > 久未更 系列一:在html中引入外部css样式表 //引入外部css样式表 //<lilnk>要放在<head>标签的第一行, ...

  9. CSS样式表的写作规范

    推荐大家使用的CSS书写规范.顺序 写了这么久的CSS,但自己都没有按照良好的CSS书写规范来写CSS代码,东写一段西写一段,命名也是想到什么写什么,过一段时间自己都不知道写的是那一块内容, 这样会影 ...

随机推荐

  1. Python导入模块的三种形式

    Python导入模块的3中方式: 1.import module_name 这样在程序里就可以通过module_name.metnod_name()的方式访问模块里的函数了 Example: > ...

  2. 探究android控件及布局

    控件(widget) 1. TextView(该控件的一些需要注意的属性,下同) gravity="center"textSize="24sp"textColo ...

  3. chapter 10 统计检验

    1.permutation test 用途:用于检验两组数据是否出生于同一分布 思路:如果产生于同一分布,两组数据混合,重新排列后,计算的基于两组数据的函数值(均值,中位数,方差等,下面程序中使用f指 ...

  4. MySQL必知必会 学习笔记(一)

    第一章  了解SQL 模式:   关于数据库和表的布局以及特性的信息.[描述表可以存储什么样的数据,数据如何分解,各部分信息如何命名等等,可以用来描述数据库中特定的表以及整个数据库(和其中表的关系)] ...

  5. dhtmlgrid修改,支持IE10

    因为项目IE升级,导致原来使用的dhtmlgrid无法正常显示,同时通过loadxml接口还有属性不支持. 花了半天时间对dhtmlgrid进行了修改,能够支持IE10正常加载显示. edit by ...

  6. html表单提交的几种方法

    原文地址:http://www.ijser.cn/?p=34 最普通最经常使用最一般的方法就是用submit type..看代码: <form name=”form” method=”post” ...

  7. java对象的内存布局(二):利用sun.misc.Unsafe获取类字段的偏移地址和读取字段的值

    在上一篇文章中.我们列出了计算java对象大小的几个结论以及jol工具的使用,jol工具的源代码有兴趣的能够去看下.如今我们利用JDK中的sun.misc.Unsafe来计算下字段的偏移地址,一则验证 ...

  8. android实现点击短链接进入应用 并获得整个连接的内容

    例如:我收到一个短信是一个链接:http://www.qq.com/a/b/?, 当我点击以后我要实现的场景是:点击----->有两种情况可供选择:手机中有此应用,跳转到应用:反之,则进入网页. ...

  9. html系列教程--元素

    HTML 元素语法 HTML 元素以开始标签起始 HTML 元素以结束标签终止 元素的内容是开始标签与结束标签之间的内容 某些 HTML 元素具有空内容(empty content) 空元素在开始标签 ...

  10. webview与JavaScript之间的交互

    据说WebView的强大之处就是能和JavaScript进行交互调用. 参考博客:http://droidyue.com/blog/2014/09/20/interaction-between-jav ...