JavaScript-12(脚本化CSS)

一、查询CSS样式

1.查询style属性样式

element.style.cssAttrName
要查询的样式必须写在style 属性里

2.查询计算出的样式

window.getComputedStyle
- IE9+ 标准浏览器
- getComputedStyle 第二个参数可以指定after或before

element.currentStyle

IE浏览器

  <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>查询元素的计算样式</title></head><body><script>console.log(document.body.style.margin);try {/*IE8-不支持*/var styleObj = window.getComputedStyle(document.body);/*所有的默认样式*/console.log(styleObj);console.log(styleObj.margin);console.log(styleObj.marginLeft);} catch (e) {/*兼容IE*/console.log(document.body.currentStyle)console.log(document.body.currentStyle.marginLeft)}   </script></body>

转载于:https://www.cnblogs.com/1666818961-lxj/p/7487527.html

JavaScript-12(脚本化CSS)相关推荐

第17章　脚本化CSS
第17章脚本化CSS CSS脚本化是网页交互效果的技术基础,使用CSS和JavaScript可以设计网页动画.利用脚本化CSS可以动态地改变HTML属性,如字体颜色.字体大小等,还可以用它设置和改变 ...
深入理解脚本化CSS系列第五篇——动态样式
前面的话很多时候,DOM操作比较简单明了,因此用javascript生成那些通常原本是HTML代码生成的内容并不麻烦.但由于浏览器充斥着隐藏的陷阱和不兼容问题,处理DOM中的某些部分时要复杂一些,比 ...
脚本化CSS类-HTML5 classList属性
HTML元素可以有多个CSS类名,class属性保存了一个用空格隔开的类名列表.标识符class在JavaScript中是保留字,所以在JavaScript中可以用className. //如下代码设 ...
深入理解脚本化CSS系列第二篇——查询计算样式
前面的话元素的渲染结果是多个CSS样式博弈后的最终结果,这也是CSS中的C(cascade)层叠的含义.访问第一篇中的style属性只能获取行间样式,这通常来说,并不是我们想要的结果.本文将详细介绍 ...
9_js 日期对象Date()、js定时器、获取窗口属性、获取dom尺寸、脚本化css
日期对象Date() 封装函数,打印当前是何年何月何日何时,几分几秒直接看w3c上的介绍吧 https://www.w3school.com.cn/js/jsref_obj_date.asp js定 ...
javascript学习笔记之document对象、表单及表单元素、脚本化cookie
一.document对象每个window对象都有document属性.该属性引用表示在窗口中显示的HTML文档的document对象. 1.关键方法 close()关闭open方法打开的文档 ope ...
Javascript学习7 - 脚本化浏览器窗口
原文:Javascript学习7 - 脚本化浏览器窗口本节讨论了文档对象模型.客户端Javascript下Window中的各项属性,包括计时器.Location对象.Histroy对象.窗口.浏览器 ...
HTML5期末大作业：轮滑运动体育类人物介绍主题网站设计(12页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计
HTML5期末大作业:轮滑运动体育类人物介绍主题网站设计(12页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计 web学生网页设计作业源码常见网页 ...
web课程设计网页规划与设计：摄影/拍摄/相片网站设计——摄影网(12页)HTML+CSS+JavaScript div+css网页html成品学生作业
HTML5期末大作业:摄影/拍摄/相片网站设计--摄影网(12页)HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计计算机毕设网页设计源码常见网页设计作 ...

JavaScript-12(脚本化CSS)

一、查询CSS样式

1.查询style属性样式

2.查询计算出的样式

JavaScript-12(脚本化CSS)相关推荐

最新文章

热门文章