前端三把利器
HTML
-标签 (成对写不容易忘记闭合)
自闭和标签
标签里写个 xx=xx, 表示标签的属性
注释
Head:
Meta(metadata information)
提供有关页面的元信息,例:页面编码、刷新、跳转、针对搜索引擎和更新频度的描述和关键词
1. 页面编码(告诉浏览器是什么编码)
< meta http-equiv=“content-type” content=“text/html;charset=utf-8”>
2刷新和跳转
< meta http-equiv=“Refresh” Content=“30″>
< meta http-equiv=”Refresh“ Content=”5; Url=http://www.autohome.com.cn“ />
3关键词
< meta name="keywords" content="星际2,星际老男孩,专访,F91,小色,JOY" >
4描述
例如:cnblogs
5 X-UA-Compatible
Title
网页头部信息
Link
css
< link rel="stylesheet" type="text/css" href="css/common.css" >
icon (title框里)
< link rel="shortcut icon" href="image/favicon.ico">
Style
在页面中写样式
例如:
< style type="text/css" >
.bb{
background-color: red;
}
< /style>
Script
引进文件
< script type="text/javascript" src="http://www.googletagservices.com/tag/js/gpt.js">
写js代码
< script type="text/javascript" > ...
HTML
常用标签
h,p,br: id
a: id href target
div:id
大致分类:
块标签 (自己占一行)
内连(行内)标签 (内容有多少就占多少)
特殊符号有特殊代码展示
标签:
段落:
换行:
属性:
跳转2
a锚
(寻找页面中id=i1的标签,将其标签放置在页面顶部,id不允许重复)
标题:
H1
H2
….
H6
生成横线
标签可以嵌套
系列标签:
text
password
radio
checkbox
file
button 按钮
submit 提交当前表单 value:显示的字
reset 重置表单
-option 提交时候也用value,可以节省
-optgroup
-多行文本
action=“url”要提交的内容放置在form标签中 上传文件注意加上:enctype=“multipart/form/data"name相当于提交 key:value, name是key,输入是value
提交checkbox,radio 等选择时要写 value, 默认会出现不可预知的错误
关联光标 id
ul
,ol,dlTable:
colspan 合并单元
rowspan 合并单元
第一列第二列
第一列第二列fieldset
iframe
CSS
存在形式:
优先级:
标签属性 >html头部(
选择器
标签选择器
div选择器
id选择器
class选择器
层级选择器
组合选择器
样式
.c1{
color: red;
background-color: aqua;
font-size:32px;
height: 150px;
width: 500px;
}
.img{
background-image: url("4.gif");
height:150px;
width:500px;
/*图片的凿洞才能看见*/
background-repeat: no-repeat;
background-position: 84px -58px;
}
边框
border(-top/left/right bottom) px solid/dotted/ color
展示 display
display:none (隐藏标签)
display:block (内连变块级)
display:inline (块级变内连)
纯内连标签高度宽度不生效
cursor:
pointer
help
wait
crosshair
move
边距:
内边距 margin (本身不增加)
外边距 padding (本身增加)
漂浮:
float
position:
relative 和absolute配合
absolute --固定窗口,滚动移动,会寻找父级的absolute
fixed --固定 窗口
一、“JavaScript中无块级作用域”
在Java或C#中存在块级作用域,即:大括号也是一个作用域。
Java
C#
在JavaScript语言中无块级作用域
补充:标题之所以添加双引号是因为JavaScript6中新引入了 let 关键字,用于指定变量属于块级作用域。
二、JavaScript采用函数作用域
在JavaScript中每个函数作为一个作用域,在外部无法访问内部作用域中的变量。
三、JavaScript的作用域链
由于JavaScript中的每个函数作为一个作用域,如果出现函数嵌套函数,则就会出现作用域链。
如上述代码则出现三个作用域组成的作用域链,如果出现作用域链后,那么寻找变量时候就会出现顺序,对于上述实例:
当执行console.log(xo)时,其寻找顺序为根据作用域链从内到外的优先级寻找,如果内层没有就逐步向上找,直到没找到抛出异常。
四、JavaScript的作用域链执行前已创建
JavaScript的作用域在被执行之前已经创建,日后再去执行时只需要按照作用域链去寻找即可。
示例一:
上述代码,在函数被调用之前作用域链已经存在:
全局作用域 -> Func函数作用域 -> inner函数作用域
当执行【ret();】时,由于其代指的是inner函数,此函数的作用域链在执行之前已经被定义为:全局作用域 -> Func函数作用域 -> inner函数作用域,所以,在执行【ret();】时,会根据已经存在的作用域链去寻找变量。
示例二:
上述代码和示例一的目的相同,也是强调在函数被调用之前作用域链已经存在:
全局作用域 -> Func函数作用域 -> inner函数作用域
不同的时,在执行【var ret = Func();】时,Func作用域中的xo变量的值已经由 “eric” 被重置为 “seven”,所以之后再执行【ret();】时,就只能找到“seven”。
示例三:
上述代码,在函数被执行之前已经创建了两条作用域链:
全局作用域 -> Bar函数作用域
全局作用域 -> Func函数作用域
当执行【ret();】时,ret代指的Bar函数,而Bar函数的作用域链已经存在:全局作用域 -> Bar函数作用域,所以,执行时会根据已经存在的作用域链去寻找。
五、声明提前
在JavaScript中如果不创建变量,直接去使用,则报错:
JavaScript中如果创建值而不赋值,则该值为 undefined,如:
在函数内如果这么写:
上述代码,不报错而是输出 undefined,其原因是:JavaScript的函数在被执行之前,会将其中的变量全部声明,而不赋值。所以,相当于上述实例中,函数在“预编译”时,已经执行了var xo;所以上述代码中输出的是undefined。