變量的作用域
全局變量：函數(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ù)
用變量的方式定義函數(shù)
// function myAlert(){
//? ?? alert('hello!');
// }
// var myAlert;
// myAlert();
// alert(myAlert);//undefined 聲明變量沒有賦值
var myAlert = function () {
?? alert('hello!');
};//函數(shù)的調(diào)用不能提前
myAlert();
閉包
閉包的本質(zhì)就是函數(shù)嵌套，就是在函數(shù)里面定義函數(shù)，
內(nèi)部函數(shù)可以引用外部函數(shù)的參數(shù)和變量
參數(shù)和變量不會被垃圾回收機(jī)制給回收
閉包的用途：可以存循環(huán)的索引值、做私有變量計數(shù)器
?? function aa(b){
? ? ? var a = 12;
? ? ? function bb() {
? ? ? ?? alert(a);
? ? ? ?? alert(b);
}
? ? ? return bb;
}
?? var cc = aa(24);//全局變量不會被回收
閉包存循環(huán)的索引值
<style type=''text-css''>
li{
? ? ? height:30px;
? ? ? background-color:#2cbeff;
? ? ? margin-bottom:10px;
}
</style>
<script type=''text/javascript''>
window.onload = function(){
?? //閉包的用途：存循環(huán)的索引值
? ? ? var aLi = document.getElementsByTagName('li');
? ? ? alert(aLi.length);
? ? ? for (var i = 0; i< aLi.length; i++){
? ? ? ?? (function (j) {
? ? ? ?? aLi[j].onclick = function () {
? ? ? ? ? ? alert(j)
}
? ? ? ?? })(j);
}
}
</script>
閉包做私有變量計數(shù)器
<script type=''text/javascript''>
//閉包的用途：私有變量計數(shù)器
var count = (function(){
?? var a = 0;
?? function bb(){
? ? ? //count調(diào)用 bb就調(diào)用 a就自增 a(全局變量)不會被垃圾回收
? ? ? a++;
? ? ? return a;
}
?? return bb;//返回值賦值給count bb里用到a
})();
alert(count());//函數(shù)被調(diào)用
alert(count());
var c = count();
alert(c);
</script>
閉包做選項(xiàng)卡
<style type=''text-css''>
.btns{
?? /*按鈕*/
? ? ? width:500px;
? ? ? height:50px;
}
?? /*選項(xiàng)卡的樣式*/
?? .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''>
//閉包做選項(xiàng)卡
?? 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>
