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解决兼容性的方法

  1.||

  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 这个对象压根就不存在的是人为定义并且没赋值

1. var a;undefined

2.div.aa undefined

元素节点的树状图

document>documentelement>body>tagName

offsetLeft/offset 结合运动

滚动轮播

    

js操作css样式,null和undefined的区别?的更多相关文章

  1. 11-13 js操作css样式

    1.Js操作css样式 Div.style.width=”100px”.在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性,跟实际项目是不符. ...

  2. js操作css样式、js的兼容问题

    一.js操作css样式 div . style . width="200px" 在div标签内我们添加了一个style属性,并设定width值.这种写法会给标签带来大量的style ...

  3. JS操作CSS样式

    一.样式表(css) 使用样式表可以更好的显示WEB文档,也可以结合javascript从而实现很好的控制样式表. 样式(css)与内容(html): HTML是处理文档结构的,HTML可以实现如何把 ...

  4. js中NAN、NULL、undefined的区别

    NaN:保留字(表明数据类型不是数字) undefined:对象属性或方法不存在,或声明了变量但从未赋值.即当你使用了对象未定的属性或者未定义的方法时或当你声明一个变量,但你确从未对其进行赋值,便对其 ...

  5. JS操作css样式用法

    //html <div id="div1" style="background:red;"> 修改背景颜色 </div> <but ...

  6. js中css样式

    1.js操作css样式 例如 div . style . width=“100px”. 就是在div标签内我们添加一个style属性,并设定了width值,这种写法会给标签带来大量的style属性,跟 ...

  7. jq选择器(jq 与 js 互相转换),jq操作css样式 / 文本内容, jq操作类名,jq操作全局属性,jq获取盒子信息,jq获取位置信息

    jq选择器(jq 与 js 互相转换) // 获取所有的页面元素jq对象 $('css3选择器语法'); var $box = $(".box:nth-child(1)"); 获取 ...

  8. 前端(十二)—— JavaScript基础操作:if语句、for循环、while循环、for...in、for...of、异常处理、函数、事件、JS选择器、JS操作页面样式

    JavaScript基础操作 一.分支结构 1.if语句 if 基础语法 if (条件表达式) { 代码块; } // 当条件表达式结果为true,会执行代码块:反之不执行 // 条件表达式可以为普通 ...

  9. 浅谈JS中的!=、== 、!==、===的用法和区别 JS中Null与Undefined的区别 读取XML文件 获取路径的方式 C#中Cookie,Session,Application的用法与区别? c#反射 抽象工厂

    浅谈JS中的!=.== .!==.===的用法和区别   var num = 1;     var str = '1';     var test = 1;     test == num  //tr ...

随机推荐

  1. iOS开发之ReactiveCocoa下的MVVM

    最近工作比较忙,但还是出来更新博客了,今天给大家分享一些ReactiveCocoa以及MVVM的一些东西,干活还是比较足的.在之前发表过一篇博文,名字叫做<iOS开发之浅谈MVVM的架构设计与团 ...

  2. Python编程练习:使用 turtle 库完成叠边形的绘制

    绘制效果: 源代码: # 叠边形 import turtle turtle.setup(650,350,200,200) turtle.penup() turtle.fd(-100) turtle.l ...

  3. 每天学点SpringCloud(四):Feign的使用及自定义配置

    Feign:SpringCloud的官网对它的定义是这样的: 是一个声明式的Web服务客户端.它支持Feign本身的注解.JAX-RS注解以及SpringMVC的注解.Spring Cloud集成Ri ...

  4. Java核心技术卷一基础技术-第13章-集合-读书笔记

    第13章 集合 本章内容: * 集合接口 * 具体的集合 * 集合框架 * 算法 * 遗留的集合 13.1 集合接口 Enumeration接口提供了一种用于访问任意容器中各个元素的抽象机制. 13. ...

  5. 第一节:学会Java前提-手把手教你配置JDK环境变量

    前言 大家好,今天写一遍学会Java前提-手把手教你配置JDK环境变量的概述,希望你们喜欢 下载地址 下载jdk,和eclipse就比较简单了,提供JDK 9 地址: http://www.oracl ...

  6. [Swift-2019力扣杯春季初赛]3. 最小化舍入误差以满足目标

    给定一系列价格 [p1,p2...,pn] 和一个目标 target,将每个价格 pi 舍入为 Roundi(pi) 以使得舍入数组 [Round1(p1),Round2(p2)...,Roundn( ...

  7. Spring详解(七)------AOP 注解

    上一篇博客我们讲解了 AspectJ 框架如何实现 AOP,然后具体的实现方式我们是通过 xml 来进行配置的.xml 方式思路清晰,便于理解,但是书写过于麻烦.这篇博客我们将用 注解 的方式来进行 ...

  8. 关于常用的编码工具如何引入jar包

    myeclipse和eclipse(差不多)引入jar包: 普通项目: 1.对准你的项目创建一个文件夹名字尽量命名成lib(注意要和src平级,不要在src下创建文件夹). 2.将下载好的依赖放到li ...

  9. Python - Fabric简介

    1 - Fabric Fabric是一个Python的库,提供了丰富的同SSH交互的接口,可以用来在本地或远程机器上自动化.流水化地执行Shell命令. 非常适合用来做应用的远程部署及系统维护.简单易 ...

  10. 你不知道的JavaScript --- 作用域相关

    本篇是<你不知道的JavaScript>的读书笔记 什么是作用域? 程序离不变量,那么变量存储在哪里?程序需要时如何找到他们? 这些问题说明需要一套设计良好的规则来存储变量, 并且之后可以 ...