11-13 js操作css样式
1.Js操作css样式
Div.style.width=”100px”.在div标签内我们添加了一个style属性,并设定了width值。这种写法会给标签带来大量的style属性,跟实际项目是不符。
我们没有让css和html分离。
所以如果是为了获取css样式
window.getComputedStyle() 获取经过计算机计算的所有属性就是只要渲染出来的都是经过计算的。
getComputedStyle()第一个参数是当前元素,第二个一般我们写null,并且这个方法是只读,
Ie6-8 不支持这个用法,ie的是用currentStyle 
2.try{}catch(error){}不报错执行try里面的代码块,报错执行catch里面的代码块。前提条件是报错,如果不是报错不能使用
var csss;
try{
csss=window.getComputedStyle(aa,null)
}catch(e){
csss=aa.currentStyle
}
console.log(csss)
总结:
Js解决兼容的方法
- ||:Var dd=document.documentElement.clientWidth||document.body.clientWidth
2.if()else{}
if(window.getComputedStyle){
csss=window.getComputedStyle(aa,null)
}else{
csss=aa.currentStyle
}
console.log(csss)
3.try{} catch(err){}:必须在报错的条件下,和if else比较性能上比较差,不在万不得以的情况下不使用
只读 可写
只读: 只能获取不能修改
可写:可以修改的
Null和undefined的区别:
Null和undefined都表示没有值
Null 是这个东西是天生存在的但是没给值。
如果我们需要清除浏览器变量的内存需要赋值null
比如:
var aa=document.getElementById("aa")
console.log(aa.parentNode.parentNode.parentNode.parentNode) null
undefined 这个东西压根就不存在的是人为定义的并且没赋值。
- var a;undefined
- Div.aa undefined
元素节点的树状图
Document>documentElement>body>tagName
offsetLeft/offsetTop 结合运动
滚动轮播
11-13 js操作css样式的更多相关文章
- js操作css样式、js的兼容问题
一.js操作css样式 div . style . width="200px" 在div标签内我们添加了一个style属性,并设定width值.这种写法会给标签带来大量的style ...
- js操作css样式,null和undefined的区别?
1.js操作css的样式 div.style.width="100px"在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性, ...
- JS操作CSS样式
一.样式表(css) 使用样式表可以更好的显示WEB文档,也可以结合javascript从而实现很好的控制样式表. 样式(css)与内容(html): HTML是处理文档结构的,HTML可以实现如何把 ...
- JS操作css样式用法
//html <div id="div1" style="background:red;"> 修改背景颜色 </div> <but ...
- js中css样式
1.js操作css样式 例如 div . style . width=“100px”. 就是在div标签内我们添加一个style属性,并设定了width值,这种写法会给标签带来大量的style属性,跟 ...
- jq选择器(jq 与 js 互相转换),jq操作css样式 / 文本内容, jq操作类名,jq操作全局属性,jq获取盒子信息,jq获取位置信息
jq选择器(jq 与 js 互相转换) // 获取所有的页面元素jq对象 $('css3选择器语法'); var $box = $(".box:nth-child(1)"); 获取 ...
- js改变css样式
CreateTime--2017年10月31日15:14:12 Author:Marydon js改变css样式 1.js改变单个css样式 HTML部分 <div id="tes ...
- 前端(十二)—— JavaScript基础操作:if语句、for循环、while循环、for...in、for...of、异常处理、函数、事件、JS选择器、JS操作页面样式
JavaScript基础操作 一.分支结构 1.if语句 if 基础语法 if (条件表达式) { 代码块; } // 当条件表达式结果为true,会执行代码块:反之不执行 // 条件表达式可以为普通 ...
- js设置css样式.
在js设置css样式做法 var obj = document.getElementById('div'); obj.style.width = '100px'; obj.style.height = ...
随机推荐
- webpack学习笔记--整体配置结构
之前的章节分别讲述了每个配置项的具体含义,但没有描述它们所处的位置和数据结构,下面通过一份代码来描述清楚: const path = require('path'); module.exports = ...
- [转] 三种方法实现js跨域访问
1.基于iframe实现跨域 基于iframe实现的跨域要求两个域具有aa.xx.com,bb.xx.com这种特点,也就是两个页面必须属于一个基础域(例如都是xxx.com,或是xxx.com.cn ...
- la 4490
题解: 这道思路还是比较水的 我们可以等价变形成hi<=7 我们的最优决策是把抽出来的那些相同颜色的书最后插在一起(所以要统计序列中还有没有相同元素的书) f[i][j][k][x]表示前i本书 ...
- flink--DateSet开发--简单入门
开发流程 1. 获得一个execution environment, 2. 加载/创建初始数据, 3. 指定这些数据的转换, 4. 指定将计算结果放在哪里, 5. 触发程序执行 例子: object ...
- P1030 求先序排列 P1305 新二叉树
题目描述 给出一棵二叉树的中序与后序排列.求出它的先序排列.(约定树结点用不同的大写字母表示,长度\le 8≤8). 输入输出格式 输入格式: 22行,均为大写字母组成的字符串,表示一棵二叉树的中序与 ...
- CISCO ACL配置(目前)
什么是ACL? 访问控制列表简称为ACL,访问控制列表使用包过滤技术,在路由器上读取第三层及第四层包头中的信息如源地址,目的地址,源端口,目的端口等,根据预先定义好的规则对包进行过滤,从而达到访问控制 ...
- 大数据小白系列——HDFS(4)
这里是大数据小白系列,这是本系列的第四篇,来看一个真实世界Hadoop集群的规模,以及我们为什么需要Hadoop Federation. 首先,我们先要来个直观的印象,这是你以为的Hadoop集群: ...
- ORA-01000: maximum open cursors exceeded
网上搜索了一下,找到了原因根源: 使用Oracle数据库的时候,经常会碰到有ORA-01000: maximum open cursors exceeded的错误.实际上,这个错误的原因,主要还是代码 ...
- AS安装过程中出现的错误
1.首先是You may need to adjust the proxy settings in Gradle.的错误, 主要是看你有没有图中红线所画的gradle的压缩包 如果没有,那就前往htt ...
- 路由网关---zuul
Zuul:Zuul 是在云平台上提供动态路由,监控,弹性,安全等边缘服务的框架.Zuul 相当于是设备和 Netflix 流应用的 Web 网站后端所有请求的前门. 在微服务盛行的时代,客户端与系统之 ...