变量的作用域
全局变量：函数外部定义的变量，函数内部和外部都可以访问，它的值可以共享
局部变量：函数内部定义的变量，函数内部可以访问，外部无法访问。函数内部访问变量时，先在内部查找是否有此变量，如果有，就使用内部变量，如果没有，就去外部查找
函数内部如果不用'var'关键字定义变量，变量可能会变成全局变量，如果用严格模式解析会报错
封闭函数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>封闭函数</title>
<script type="text/javascript">
/*原来的写法
function myAlert(){
var str = '欢迎访问我的主页';
alert(str);
}
myAlert();*/
var str = function(){
alert('test');
}
//封闭函数的一般写法
//封闭函数定义：(function(){……})()
/*
;;(function(){
var str = '欢迎访问我的主页';
alert(str);
})();//最后的()表示马上执行
*/
//封闭函数其他的写法：在匿名函数前加“！”或者“~”，之后加“()”
~function(){
var str = '欢迎访问我的主页';
alert(str);
}();
</script>
</head>
<body>
</body>
</html>
用变量的方式定义函数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用变量的方式定义函数</title>
<script type="text/javascript">
/*
原来的写法：可以提前
myAlert();
function myAlert(){
alert('hello!');
}*/
//函数用变量方式定义：先定义再使用
// myalert();//提前会报错
var myAlert = function(){
alert('hello!');
}
myAlert();//放在下面可以执行
</script>
</head>
<body>
</body>
</html>
闭包
闭包的本质就是函数嵌套，就是在函数里面定义函数，
内部函数可以引用外部函数的参数和变量
参数和变量不会被垃圾回收机制给回收
闭包的用途：可以存循环的索引值、做私有变量计数器
闭包的一般写法
function aa(b){
var a = 12;
function bb(){
alert(a);
alert(b);
}
return bb;
}
var cc = aa(24);*/
//闭包的封闭函数写法
var cc = (function(b){
var a = 12;
function bb(){
alert(a);
alert(b);
}
return bb;
})(24);
cc();
/*
//只能调用一次的闭包
(function(b){
var a = 12;
function bb(){
alert(a);
alert(b);
}
return bb;
})(24)();
*/
</script>
闭包存循环的索引值
闭包做私有变量计数器
闭包做选项卡
<style type=''text-css''>
.btns{
/*按钮*/
width:500px;
height:50px;
}
/*选项卡的样式*/
.btns input{
width:100px;
height:50px;
background-color:#ddd;/*默认灰色*/
color:#666;
border:0px;
}
.btns input.cur{
background-color:#bbaaff;
}
/*内容区的样式*/
.contents div{
width:500px;
height:300px;
background-color:#bbaaff;
/*内容隐藏*/
display:none;
text-align:center;
line-height:300px;
}
.contents div.active{
display:block;
}
</style>
<script type=''text/javascript''>
//闭包做选项卡
window.onload = function(){
var btns = document.getElementById('btns'
).getElementsByTagName('input');
var cons = document.getElementById('contents'
).getElementsByTagName('div');
for (var i=0; i<btns.length; i++){
btns[i].onclick =function () {
for (var j=0;j<btns.length; j++){
btns[j].className = '';
}
this.className = 'cur';
}
}
}
</script>
<div class="btns" id="btns">
<input type="button" value="tab01" class="cur">
<input type="button" value="tab02">
<input type="button" value="tab03">
</div>
<div class="contents" id="contents">
<div class="active">tab文字内容一</div>
<div>tab文字内容二</div>
<div>tab文字内容三</div>
</div>
跳转的源页面
<script type="text/javascript">
var backurl = document.referrer;
//登录逻辑
//跳转到上一个页面
window.location.href = backurl;
</script>
<body>
< a href="http://www.beicai.com">北财网</ a>
</body>
获取地址栏参数
<script type="text/javascript">
//file:///D:/HTML/%E5%89%8D%E7%AB%AF/demo/demo-A/156%E8%8E%B7%E5%8F%96%E5%9C%B0%E5%9D%80%E6%A0%8F%E5%8F%82%E6%95%B0.html?username=tom#12
var data = window.location.search;//获取地址参数部分
// console.log(data);// ?username=tom 打印获取到的数据
var arr = data.split('=');
console.log(arr);//用=切割['?username','tom']
var name = arr[1];//
var span01 = document.getElementById('span01')
span01.innerHTML = name;//往span里添加内容
var hash = window.location.hash;
console.log(hash);//#12
</script>
<body>
<div>欢迎<span id="span01"></span>访问我的主页</div>
</body>
