变量的作用域
全局变量：函数外部定义的变量，函数内部和外部都可以访问，它的值可以共享
局部变量：函数内部定义的变量，函数内部可以访问，外部无法访问。函数内部访问变量时，先在内部查找是否有此变量，如果有，就使用内部变量，如果没有，就去外部查找
函数内部如果不用'var'关键字定义变量，变量可能会变成全局变量，如果用严格模式解析会报错
封闭函数
用变量的方式定义函数
// function myAlert(){
// alert('hello!');
// }
// var myAlert;
// myAlert();
// alert(myAlert);//undefined 声明变量没有赋值
var myAlert = function () {
alert('hello!');
};//函数的调用不能提前
myAlert();
闭包
闭包的本质就是函数嵌套，就是在函数里面定义函数，
内部函数可以引用外部函数的参数和变量
参数和变量不会被垃圾回收机制给回收
闭包的用途：可以存循环的索引值、做私有变量计数器
function aa(b){
var a = 12;
function bb() {
alert(a);
alert(b);
}
return bb;
}
var cc = aa(24);//全局变量不会被回收
闭包存循环的索引值
<style type=''text-css''>
li{
height:30px;
background-color:#2cbeff;
margin-bottom:10px;
}
</style>
<script type=''text/javascript''>
window.onload = function(){
//闭包的用途：存循环的索引值
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>
闭包做私有变量计数器
<script type=''text/javascript''>
//闭包的用途：私有变量计数器
var count = (function(){
var a = 0;
function bb(){
//count调用 bb就调用 a就自增 a(全局变量)不会被垃圾回收
a++;
return a;
}
return bb;//返回值赋值给count bb里用到a
})();
alert(count());//函数被调用
alert(count());
var c = count();
alert(c);
</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>
