JS(三)

最新推荐文章于 2022-10-09 17:47:23 发布

weixin_30546189

最新推荐文章于 2022-10-09 17:47:23 发布

阅读量62

点赞数

原文链接：http://www.cnblogs.com/zswmv/p/7086101.html

版权

cssText//对之前的cssText覆盖

<style>
#div1{
border:1px solid black;
}
</style>
</head>
<body>
<div id=div1>123</div>
<input id="btn1" type="button" value="按钮" />
<script>
var div1=document.getElementById('div1');
var btn1=document.getElementById('btn1');
div1.onclick=function(){
div1.style.cssText='width:200px;height:200px;';
}
btn1.onclick=function(){
div1.style.cssText='';
}
</script>
</body>

禁止点击按钮

disabled=true；

this:指的是调用当前方法（函数）的那个对象

alert(this);//object window
function fn1(){ alert(this);}
var oBtn=document.getElementById('btn1');
oBtn.οnclick=function(){
fn1();//}指window这个对象
oBtn.οnclick=fn1;//指向oBtn这个对象
fn1();//this指向window

//fn1()里面的this指向window
例子：

<body>
<input type="button" value="按钮" />
<input type="button" value="按钮" />
<input type="button" value="按钮" />
<script>
var inputs=document.getElementsByTagName('input');
for(var i=0;i<inputs.length;i++)
{
    inputs[i].onclick=function()
    {
        this.style.background='yellow';
    }
}
</script>
</body>
或
<body>
<input type="button" value="按钮" />
<input type="button" value="按钮" />
<input type="button" value="按钮" />
<script>
var inputs=document.getElementsByTagName('input');
var that;
for(var i=0;i<inputs.length;i++)
{
    inputs[i].onclick=function()
    {
        that=this;
        fn1();
    }
}
function fn1(){
    that.style.background='yellow';
    
    }
</script>
</body>
或
<body>
<input type="button" value="按钮" />
<input type="button" value="按钮" />
<input type="button" value="按钮" />
<script>
var inputs=document.getElementsByTagName('input');
var that;
for(var i=0;i<inputs.length;i++)
{
    inputs[i].onclick=fn1   
}
function fn1(){
    this.style.background='yellow';
    }
</script>
</body>

'js解析器'

域：先解析，后执行
1、js的预解析：找var、 function、参数
a=未定义
所有的变量，在正式运行代码之前，都提前赋了一个值：未定义
fn1=function fn1（）{alert（1）；}
所有的函数，在正式运行代码之前，都是整个函数块
遇到重名的：只留一个。变量和函数重名，就只留函数；函数和函数重名，留后面那个。
2、逐行解读代码
表达式可以改变预解析的值，表达式包含参数
例子：
alert(a);//function a(){alert(4);}
var a=1;
alert(a);//1
function a(){alert(2);}
alert(a);//1
a=3;
alert(a);//3
function a(){alert(4);}
alert(a);//3
a();//报错
例子（注意这几个例子的区别）：

var a=1;
function fn1(){
alert(a);//undefined
var a=2;
}
fn1();
alert(a);//1

var a=1;
function fn1(){
alert(a);//undefined
a=2;//1
}
fn1();
alert(a);//2

var a=1;
function fn1(a){
alert(a);
a=2;
}
fn1();//undefined
alert(a);//1

var a=1;
function fn1(a){
alert(a);
a=2;
}
fn1(a);//1
alert(a);//1

函数在自己的预解析域找不到变量可以改用全局变量

想要获取函数内的值

var str="";
function fn1(){
var a="zsw";
str=a;
}
fn1();
alert(str);

function fn2(){
var a='www';
fn3(a);
}
fn2();//www
function fn3(a){
alert(a);
}

if、for、while不是一个作用域(注意以下区别)

window.onload=function(){
    var oBtn=document.getElementsByTagName('input');
    for(var i=0;i<oBtn.length;i++)
    {
        oBtn[i].onclick=function(){
            alert(i);//3 ?
            }
    }
    }

window.onload=function(){
    var oBtn=document.getElementsByTagName('input');
    for(var i=0;i<oBtn.length;i++)
    {
        oBtn[i].onclick=function(){
            alert(i);//undefined
            for(var i=0;i<oBtn.length;i++)
            {
                oBtn[i].style.background='yellow';
            }
            }
    }
    }

window.onload=function(){
    var oBtn=document.getElementsByTagName('input');
    for(var i=0;i<oBtn.length;i++)
    {
        oBtn[i].onclick=function(){
            alert(i);//3
            for(i=0;i<oBtn.length;i++)
            {
                oBtn[i].style.background='yellow';
            }
            }
    }
    }

转载于:https://www.cnblogs.com/zswmv/p/7086101.html

weixin_30546189

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS(三)

cssText//对之前的cssText覆盖<style>#div1{border:1px solid black;}</style></head><body><div id=div1>123</div><input id="btn1" type="button" value="按钮" />&l...
复制链接

扫一扫