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. Speech and Booth Demo in Maker Faire Shenzhen 2018

    2018年10月12日-14日,受主办方的邀请,有幸参加了这次的Maker Faire Shenzhen 2018,并参与了Maker Faire Shenzhen 2018 论坛-创客的城市共创(C ...

  2. 了不起的WebRTC:生态日趋完善,或将实时音视频技术白菜化

    本文原文由声网WebRTC技术专家毛玉杰分享. 1.前言 有人说 2017 年是 WebRTC 的转折之年,2018 年将是 WebRTC 的爆发之年,这并非没有根据.就在去年(2017年),WebR ...

  3. Javascript高级编程学习笔记(76)—— 表单(4)选择文本

    文本框脚本 在HTML中文本框有两种实现方式: <input> <textarea> 这两种实现方式虽然在多数情况下表现一致,但是两者之间仍存在许多重要区别 对于<inp ...

  4. Javascript高级编程学习笔记(59)—— 事件(3)事件对象

    事件对象 在触发DOM‘事件时,会产生一个事件对象 event 该对象包含着所有与事件有关的信息 所有浏览器都支持 event 对象但是支持的方式有所不同 DOM事件对象 兼容DOM的浏览器会将eve ...

  5. Ubuntu18.04搭建nodejs环境

    首先安装sudo apt install curl 然后安装命令(当前最新版本是0.33.2,最新版本可以在https://github.com/creationix/nvm查看): curl -o- ...

  6. 第39节:Java当中的IO

    Java当中的IO IO的分类 第一种分:输入流和输出流 第二种分:字节流和字符流 第三种分:节点流和处理流 节点流处理数据,处理流是节点流基础上加工的. IO中的重点: InputStream Ou ...

  7. 关于在运行java连接MongoDB时遇到的连接超时问题

    在linux虚拟机里运行创建集合的时候,遇到了以下问题: 这里我最开始时使用的虚拟机IP地址进行连接,因此就出现了错误,连接超时. 在网上查了一些类似的问题,说要改驱动,后来才发现不是这个问题. 在本 ...

  8. AI - 机器学习常见算法简介(Common Algorithms)

    机器学习常见算法简介 - 原文链接:http://usblogs.pwc.com/emerging-technology/machine-learning-methods-infographic/ 应 ...

  9. [原创]K8mysqlCmd数据库免驱连接工具

    无需机器安装MYSQL驱动,可用于内网渗透(如远控cmd下连接目标内网不可上网机器数据库) 当然目标机可代理出来的话,没必要使用该工具了 因为很多功能SQL语句需要自己打,很多人可能不懂 如果更新2. ...

  10. 【分布式事务】基于RocketMQ搭建生产级消息集群?

    导读 目前很多互联网公司的系统都在朝着微服务化.分布式化系统的方向在演进,这带来了很多好处,也带来了一些棘手的问题,其中最棘手的莫过于数据一致性问题了.早期我们的软件功能都在一个进程中,数据的一致性可 ...