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 = ...
随机推荐
- MyEclipse和tomcat结合编写jsp对于中文乱码的解决方法
一.Java和jsp 中文乱码原因和解决方法: Java的内核和class文件是基于unicode的,这使Java程序具有良好的跨平台性,但也带来了一些中文乱码问题的麻烦.原因有两方面: 第一方面:J ...
- tomcat配置介绍
第一节java的介绍 java需要一个java的运行环境 JDK:包含了好几个java组件,包含类库(API) 开发工具(java) jvm(java虚拟机)JRE(类库) tomcat:开源 企业 ...
- OSPF协议之详细图解
OSPF是一种基于SPF算法的链路状态路由协议. 上图是在一个OSPF区域里面添入一台新的路由器的时候,OSPF协议的工作过程,如果你能非常详细的叙述出这张图的话,基本上OSPF协议的工作过程你就掌握 ...
- sql 分隔字符串函数
USE [tms]GO/****** Object: UserDefinedFunction [dbo].[fn_ConvertListToTable_Sort] Script Date: 2017/ ...
- 001 Hello Security 的框架搭建
一:STS 1.下载STS 官网:http://spring.io/tools 使用一个干净的STS进行操作学习. 2.jdk检查 3.添加自己的maven 4.使用tomcat 二:新建项目 1.新 ...
- day41 mycql 函数
一些经典的练习题,以及函数的简单用法,內建函数 -- 函数 python函数 def fun1(a1,a2,a3): sum = a1+a2+a3 return sum fun1(1,2,3) jav ...
- day23 面向对象 函数和方法区分
最近两周内容大概回顾: # 文件操作 # # 模块:random,序列化模块,时间模块,collections,re,os,sys # 模块与包的概念和导入方法 # 写代码的规范 # 正则表达式 # ...
- mybatis提示Invalid bound statement (not found)错误的可能原因
https://www.cnblogs.com/liaojie970/p/8034525.html
- 离线下载安装 NLTK 的 nltk_data 模块
离线下载安装 NLTK 的 nltk_data 模块 转 https://blog.csdn.net/u010167269/article/details/63684137 在 Linux 上使用 N ...
- UVa-156 Ananagrams 反片语【map】【vector】
题目链接:https://vjudge.net/contest/211547#problem/D 题目大意: 输入一些单词,找出所有满足以下条件的单词:该单词不能通过字母重排,得到输入文本中的另外一些 ...