Python 一路走来 HTML CSS Javascript
Meta(metadata information)
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
Title
网页头部信息
Style
在页面中写样式
例如:
< style type="text/css" >
.bb{
background-color: red;
}
< /style>
HTML
<thead>
<tr>
<th>第一列</th>
<td>第二列</td>
</thead>
<tbody>
<td>第一列</td>
</tbody>
CSS
.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;
}
</style>
一、“JavaScript中无块级作用域”
在Java或C#中存在块级作用域,即:大括号也是一个作用域。
Java
C#
在JavaScript语言中无块级作用域
1
2
3
4
5
6
7
|
function Main(){ if (1==1){ var name = 'seven' ; } console.log(name); } // 输出: seven |
补充:标题之所以添加双引号是因为JavaScript6中新引入了 let 关键字,用于指定变量属于块级作用域。
二、JavaScript采用函数作用域
在JavaScript中每个函数作为一个作用域,在外部无法访问内部作用域中的变量。
1
2
3
4
5
6
7
8
9
|
function Main(){ var innerValue = 'seven' ; } Main(); console.log(innerValue); // 报错:Uncaught ReferenceError: innerValue is not defined |
三、JavaScript的作用域链
由于JavaScript中的每个函数作为一个作用域,如果出现函数嵌套函数,则就会出现作用域链。
1
2
3
4
5
6
7
8
9
10
11
|
xo = 'alex' ; function Func(){ var xo = "seven" ; function inner(){ var xo = 'alvin' ; console.log(xo); } inner(); } Func(); |
如上述代码则出现三个作用域组成的作用域链,如果出现作用域链后,那么寻找变量时候就会出现顺序,对于上述实例:
当执行console.log(xo)时,其寻找顺序为根据作用域链从内到外的优先级寻找,如果内层没有就逐步向上找,直到没找到抛出异常。
四、JavaScript的作用域链执行前已创建
JavaScript的作用域在被执行之前已经创建,日后再去执行时只需要按照作用域链去寻找即可。
示例一:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
xo = 'alex' ; function Func(){ var xo = "seven" ; function inner(){ console.log(xo); } return inner; } var ret = Func(); ret(); // 输出结果: seven |
上述代码,在函数被调用之前作用域链已经存在:
- 全局作用域 -> Func函数作用域 -> inner函数作用域
当执行【ret();】时,由于其代指的是inner函数,此函数的作用域链在执行之前已经被定义为:全局作用域 -> Func函数作用域 -> inner函数作用域,所以,在执行【ret();】时,会根据已经存在的作用域链去寻找变量。
示例二:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
xo = 'alex' ; function Func(){ var xo = "eirc" ; function inner(){ console.log(xo); } xo = 'seven' ; return inner; } var ret = Func(); ret(); // 输出结果: seven |
上述代码和示例一的目的相同,也是强调在函数被调用之前作用域链已经存在:
- 全局作用域 -> Func函数作用域 -> inner函数作用域
不同的时,在执行【var ret = Func();】时,Func作用域中的xo变量的值已经由 “eric” 被重置为 “seven”,所以之后再执行【ret();】时,就只能找到“seven”。
示例三:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
xo = 'alex' ;<br> function Bar(){ console.log(xo); } function Func(){ var xo = "seven" ; return Bar; } var ret = Func(); ret(); // 输出结果: alex |
上述代码,在函数被执行之前已经创建了两条作用域链:
- 全局作用域 -> Bar函数作用域
- 全局作用域 -> Func函数作用域
当执行【ret();】时,ret代指的Bar函数,而Bar函数的作用域链已经存在:全局作用域 -> Bar函数作用域,所以,执行时会根据已经存在的作用域链去寻找。
五、声明提前
在JavaScript中如果不创建变量,直接去使用,则报错:
1
2
|
console.log(xxoo); // 报错:Uncaught ReferenceError: xxoo is not defined |
JavaScript中如果创建值而不赋值,则该值为 undefined,如:
1
2
3
|
var xxoo; console.log(xxoo); // 输出:undefined |
在函数内如果这么写:
1
2
3
4
5
6
7
|
function Foo(){ console.log(xo); var xo = 'seven' ; } Foo(); // 输出:undefined |
上述代码,不报错而是输出 undefined,其原因是:JavaScript的函数在被执行之前,会将其中的变量全部声明,而不赋值。所以,相当于上述实例中,函数在“预编译”时,已经执行了var xo;所以上述代码中输出的是undefined。
Python 一路走来 HTML CSS Javascript的更多相关文章
- Python一路走来 DAY15 Javascript
JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处理. 一 如何编写 ...
- Python 一路走来 DOM & Jquery
DOM 查找: 直接查找 间接查找 —getElementById ...
- Python一路走来 RabbitMQ
一:介绍:(induction) Rabbitmq 是一个消息中间件.他的思想就是:接收和发送消息.你可以把它想成一个邮政局.当你把你的邮件发送到邮箱的,首先你需要确认的是:邮政员先生能把你的邮件发送 ...
- Python一路走来 - python基础 数据类型
对于Python,一切事物都是对象,对象基于类创建 Python数据类型 python主要的数据类型主要包括以下几种类型: (1) 数字型 (2) 字符串 (3) 列表 (4) 元组 (5) 字典 ( ...
- Python 一路走来 Django
Web 框架 (本质:socket) Python web框架 自己实现socket - Tornado 基于wsgi ...
- Python一路走来 线程 进程
Python线程 Threading用于提供线程相关的操作,线程是应用程序中工作的最小单元. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 #!/usr/bin/env pytho ...
- Python一路走来 面向对象1
面向对象: 类,对象 函数放在类里,叫方法 封装 #如何调用 1. 创建对象, 类名() obj= Foo() 2. 通过对象去执行方法 obj.mail("leon@me.com" ...
- Python一路走来 - 模块
模块,用一砣代码实现了某个功能的代码集合. 类似于函数式编程和面向过程编程,函数式编程则完成一个功能,其他代码用来调用即可,提供了代码的重用性和代码间的耦合.而对于一个复杂的功能来,可能需要多个函数才 ...
- Python一路走来 Python算法
冒泡排序: 1,2位置左右比较.大的排右边,继续比较2,3 ...... list=[5,7,2,8,12,1] #print(len(list)) for j in range(len(list)) ...
随机推荐
- cf509A Maximum in Table
A. Maximum in Table time limit per test 2 seconds memory limit per test 256 megabytes input standard ...
- Android视频录制
public class MainActivity extends Activity { private MediaRecorder videoRecorder=null; private Butto ...
- 第一个ServiceStack程序
1. https://github.com/ServiceStack/ServiceStack/wiki/Create-your-first-webservice 2. http://tech.pro ...
- JDBC编程之事务处理
JDBC中的事务处理指的是事务的一致性等问题,例如插入一条数据(id,name,password)到表中,另一条数据(address,id)到另一张表中,并且两条数据是相关联的,那么假设第一条数据插入 ...
- android 限制adb的访问目录
最近有个特殊的要求,engneer版本既要可以adb访问,且adb有的目录不能访问 如/data/目录. 用传统的chmod chgrp等无法满足客户需求,只能修改内核文件系统部分. 添加函数,检查路 ...
- MySQL 加密/压缩函数
这些问题可能导致数据值的改变.一般而言,上述问题可能在你使用非二进制串数据类型(如char,varchar,text等数据类型)的情况下发生. AES_ENCRYPT()和AES_DECRYPT() ...
- SPOJ 416 - Divisibility by 15(贪心)
糟烂的代码啊... 这个题目思路很简单——末位只可能为0和5,所有数字的和肯定被3整除 没有0和5的肯定不行 否则,把所有数字求和 如果被3整除,则从大到小输出 如果除3余1,则按以下顺序——删1: ...
- HDU4612(Warm up)2013多校2-图的边双连通问题(Tarjan算法+树形DP)
/** 题目大意: 给你一个无向连通图,问加上一条边后得到的图的最少的割边数; 算法思想: 图的边双连通Tarjan算法+树形DP; 即通过Tarjan算法对边双连通缩图,构成一棵树,然后用树形DP求 ...
- REST深入浅出
不知你是否意识到,围绕着什么才是实现异构的应用到应用通信的“正确”方式,一场争论正进行的如火如荼:虽然当前主流的方式明显地集中在基于SOAP.WSDL和WS-*规范的Web Services领域,但也 ...
- vs2013+EF6+Mysql
1.首先需要在整个项目中添加一个Model类库,在类库中引用EF 我需要在该项目下添加EF的MYSQL对象实体 首先需要引入几个相关引用,我通过NuGet来添加,如下图 接下来我需要通过ADO.NET ...