變量的作用域
全局變量：函數(shù)外部定義的變量，函數(shù)內(nèi)部和外部都可以訪問伏伐，它的值可以共享
局部變量：函數(shù)內(nèi)部定義的變量宠进，函數(shù)內(nèi)部可以訪問，外部無法訪問藐翎。函數(shù)內(nèi)部訪問變量時材蹬，先在內(nèi)部查找是否有此變量，如果有吝镣，就使用內(nèi)部變量堤器，如果沒有，就去外部查找
函數(shù)內(nèi)部如果不用'var'關(guān)鍵字定義變量末贾，變量可能會變成全局變量闸溃，如果用嚴(yán)格模式解析會報錯
封閉函數(shù)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>封閉函數(shù)</title>
<script type="text/javascript">
/*原來的寫法
function myAlert(){
var str = '歡迎訪問我的主頁';
alert(str);
}
myAlert();*/
var str = function(){
alert('test');
}
//封閉函數(shù)的一般寫法
//封閉函數(shù)定義：(function(){……})()
/*
;;(function(){
var str = '歡迎訪問我的主頁';
alert(str);
})();//最后的()表示馬上執(zhí)行
*/
//封閉函數(shù)其他的寫法：在匿名函數(shù)前加“！”或者“~”，之后加“()”
~function(){
var str = '歡迎訪問我的主頁';
alert(str);
}();
</script>
</head>
<body>
</body>
</html>
用變量的方式定義函數(shù)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用變量的方式定義函數(shù)</title>
<script type="text/javascript">
/*
原來的寫法：可以提前
myAlert();
function myAlert(){
alert('hello!');
}*/
//函數(shù)用變量方式定義：先定義再使用
// myalert();//提前會報錯
var myAlert = function(){
alert('hello!');
}
myAlert();//放在下面可以執(zhí)行
</script>
</head>
<body>
</body>
</html>
閉包
閉包的本質(zhì)就是函數(shù)嵌套辉川，就是在函數(shù)里面定義函數(shù)表蝙，
內(nèi)部函數(shù)可以引用外部函數(shù)的參數(shù)和變量
參數(shù)和變量不會被垃圾回收機制給回收
閉包的用途：可以存循環(huán)的索引值、做私有變量計數(shù)器
閉包的一般寫法
function aa(b){
var a = 12;
function bb(){
alert(a);
alert(b);
}
return bb;
}
var cc = aa(24);*/
//閉包的封閉函數(shù)寫法
var cc = (function(b){
var a = 12;
function bb(){
alert(a);
alert(b);
}
return bb;
})(24);
cc();
/*
//只能調(diào)用一次的閉包
(function(b){
var a = 12;
function bb(){
alert(a);
alert(b);
}
return bb;
})(24)();
*/
</script>
閉包存循環(huán)的索引值
閉包做私有變量計數(shù)器
閉包做選項卡
<style type=''text-css''>
.btns{
?? /*按鈕*/
? ? ? width:500px;
? ? ? height:50px;
}
?? /*選項卡的樣式*/
?? .btns input{
? ? ? width:100px;
? ? ? height:50px;
? ? ? background-color:#ddd;/*默認(rèn)灰色*/
? ? ? color:#666;
? ? ? border:0px;
}
.btns input.cur{
? ? ? background-color:#bbaaff;
}
?? /*內(nèi)容區(qū)的樣式*/
?? .contents div{
? ? ? width:500px;
? ? ? height:300px;
? ? ? background-color:#bbaaff;
? ? ? /*內(nèi)容隱藏*/
? ? ? 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文字內(nèi)容一</div>
?? <div>tab文字內(nèi)容二</div>
?? <div>tab文字內(nèi)容三</div>
</div>
跳轉(zhuǎn)的源頁面
<script type="text/javascript">
?? var backurl = document.referrer;
?? //登錄邏輯
?? //跳轉(zhuǎn)到上一個頁面
?? window.location.href = backurl;
? </script>
<body>
? ? < a >北財網(wǎng)</ a>
</body>
獲取地址欄參數(shù)
<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;//獲取地址參數(shù)部分
? ? ? // console.log(data);// ?username=tom 打印獲取到的數(shù)據(jù)
? ? ? var arr = data.split('=');
? ? ? console.log(arr);//用=切割['?username','tom']
? ? ? var name = arr[1];//
? ? ? var span01 = document.getElementById('span01')
? ? ? span01.innerHTML = name;//往span里添加內(nèi)容
? ? ? var hash = window.location.hash;
? ? ? console.log(hash);//#12
?</script>
<body>
<div>歡迎<span id="span01"></span>訪問我的主頁</div>
</body>
