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 = ...
随机推荐
- 494. Target Sum
You are given a list of non-negative integers, a1, a2, ..., an, and a target, S. Now you have 2 symb ...
- ASP.NET Core Middleware管道介绍
public void Configure(IApplicationBuilder app, IHostingEnvironment env) { app.Use(async (context, ne ...
- nginx做代理安装docker
1.环境 服务器IP 服务用途 是否能 联网 192.168.126.128 docker服务器(简称B服务器) 不能 192.168.126.130 nginx服务器(简称A服务器) 能 2.背景 ...
- Spring Security 架构与源码分析
Spring Security 主要实现了Authentication(认证,解决who are you? ) 和 Access Control(访问控制,也就是what are you allowe ...
- 如何自动设置网页中meta节点keywords属性-【SEO】
在处理网页的SEO时,经常需要设置meta节点中keywords的属性. 如果是UGC产生内容的话,对于这个字段可以由用户或编辑手工设置相关的标签或关键词来进行. 但对于MGC(机器产生内容)的内容的 ...
- python全栈开发day78、79 --bss项目
一.回顾 1. BBS项目 CMS 1. 登录 1. form组件 2. auth模块 3. 验证码 2. 注册 1. form组件 1. 生成html代码 直接for循环form_obj,就能够遍历 ...
- Vijos1983 NOIP2015Day2T3 运输计划 transport LCA
题目链接Vijos 题目链接UOJ 该博客在博客园的链接 转载一个大佬的题解: 点击这里->大佬题解 下面谈谈我的感悟: 当然写代码也是写的很艰辛: 我力劝C++的同胞们,这题卡常数,Dfs党会 ...
- 删除Docker中所有已停止的容器
方法一: #显示所有的容器,过滤出Exited状态的容器,取出这些容器的ID, sudo docker ps -a|grep Exited|awk '{print $1}' #查询所有的容器,过滤出E ...
- Azkaban
Azkaban安装部署 https://azkaban.github.io/azkaban/docs/2.5/ 安装Azkaban ) 在/opt/module/目录下创建azkaban目录 [kri ...
- liunx命令简介
图形界面和命令行要达到的目的是一样的,都是让用户控制计算机.然而,真正能够控制计算机硬件(CPU.内存.显示器等)的只有操作系统内核(Kernel),图形界面和命令行只是架设在用户和内核之间的一座桥梁 ...