一 补充css的层叠性
权重:
行内样式(1000)>内接样式(如link等...)
id(100)>class(010)>标签(001)
如果同是继承来的,距目标越近的优先级越高
继承来的(权重为0)的和直接选中(就是直接精确到某个标签)的优先级没法比.
权重一样大的,以后设的为优先级最高
同样是继承来的且描述也一样近,在数权重
如果选中了标签了,数权重(数选择器的数量)权重越大,优先级越高.
!importa :可以设置选中标签优先级无限大.
二 js(javascript) 初始
JavaScript是由公司开发而成的，问题是不便于其他的公司拓展和使用。所以欧洲的这个ECMA的组织，牵头制定JavaScript的标准，取名为ECMAScript。
1.ECMAScript基础语法:
-
- js引入方式
行内js
内接js
外接js
-
- 声明变量
var 就这一个,JavaScript不用关心其他的一些事情（比如内存的释放、指针等），更关心自己的业务
-
- 测试语句
console.log(变量)
alert(变量) 这个全写为window.alert(window是全局对象,此处可以省略不写)
confirm()
-
- 数据类型(5个)
基本数据类型: Number,String,boolean, undefined 未定义 , null.
引用数据类型:Array,aoject,function,date
typeof:查看数据类型
-
- 运算符
需要注意是++,出现在变量前先自加1 在赋值
出现在变量后 先赋值,在加1
== : 比较的是数值
===:比较的是数之和数据类型
所有的数据都能转成false:
几种可以转为false的类型:null,undefined,0,NaN
数据类型转换:
数字转字符串:(三种)
隐式转换(空字符串加数字),强制类型转换(强制类型转String(),变量点toString()),特殊的(两个字符串数字是可以相减的,并且减完是数字类型)
字符串转数字:(三种)
强转(Number(变量)),parseInt(可以将字符串转为数字,但是只能转字符串开头的数字类型,如果前面没有,也就是说这个字符串没有含数字,则返回NAN,nan也是数字类型;并且它支取整数,不会四舍五入如果是parseIn(1.8+2.2)那么会先计算再取值,如果是parseIn(1.8)+parseIn(1.2)那他会先取值在计算),parseFloat(stringNum);
-
- 流程控制
if
var ji=20; if(ji>=20){ console.log('好') }
if else
var ji = 20; if(ji>=20){ console.log('恭喜你，吃鸡成功，大吉大利') }else{ console.log('很遗憾 下次继续努力') }
if else if else
var age = 15; if (age > 18) { console.log('来了老弟！！'); } else if (age < 18 && age > 10) { console.log('来了小老弟！！'); }else{ console.log('来了');}
switch
var gameScore = 'better'; switch(gameScore){ //case表示一个条件 满足这个条件就会走进来 遇到break跳出。break终止循环。如果某个条件中不写 break，
那么直到该程序遇到下一个break停止 // 一对一只能匹配完全一样的(===) case 'good': console.log('玩的很好'); //break表示退出 break; case 'better': console.log('玩的老牛逼了'); break; case 'best': console.log('恭喜你 吃鸡成功'); break; default: console.log('很遗憾');}
while
1.初始化循环变量
2.判断循环条件
3.更新循环变量
var a=1; while (a<=9){ console.log(a); a+=1; }
do while
//不管有没有满足while中的条件do里面的代码都会走一次,如果满足了就会遵循while循环走 var i = 3;//初始化循环变量 do{ console.log(i) i++;//更新循环条件 }while (i<10) //判断循环 //
for 循环
var a=0; for (var i=1;i<=100;i+=1){ a+=i; } console.log(a);
-
- 内置对象
例子 隐藏块:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--<link rel="stylesheet" href="">--> <link rel="stylesheet" href="授课/csss.css"> </head> <body> <button id="btn" onclick="show()">隐藏</button> <div id="box" style=""></div> </body> <script type="text/javascript" src="授课/jss.js" ></script> </html>
#box{ 200px; height: 200px; background-color: red; }
var b=true; var a=document.getElementById('box'); var c=document.getElementById('btn'); function show() { if (b) { a.style.display = 'none'; console.log(a.id); b=false; c.innerText='显示'; } else{ a.style.display='block'; console.log(a.id); b=true; c.innerText='隐藏'; } }