js - 02课 4 浅谈this

1. 在标签内部调用事件默认都是window调用的!

2. 为什么 函数fn1()必须写在window.onload = function(){} 外面才有效果!

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<input id="btn1" type="button" value="按钮1"/>
<input type="button" id="btn2" value="按钮2" onclick="fn1();"/>
<!--写在行内的事件默认对象都是window-->
<script>
    window.onload = function () {
        var oBtn1 = document.getElementById(‘btn1‘)
        var oBtn2 = document.getElementById(‘btn2‘)
        oBtn1.onclick = function () {
            alert(this);//此处this指的是oBtn1
            fn1(); // 等价于 fn1() === window.fn1(); 所以弹出的是window
        };
    }
    function fn1() {
        alert(this);
    }
</script>
</body>
</html>

  

时间: 2024-10-10 07:34:44

js - 02课 4 浅谈this的相关文章

js - 02课 4 浅谈this -3

1.两种方式绑定, this 不同的指向 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> li{width: 100px; height:150px;float:left; margin-right:30px; background: #f1f1f1;posi

js - 02课 4 浅谈this -2

1. 防止this重名,可以通过设置值,然后通过参数传递过去 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <input type="button" value="按钮1"/> &

【JS笔记系列】浅谈JavaScript函数

JavaScript作为一种基于对象(非严格面向对象)的语言,函数在JS中的地位非同一般:用函数声明类和对象.甚至函数本身也是对象. 一.函数的三种声明方式辨析. 1.function命令 function printAbc(){ console.log('ABC'); } 2.函数表达式(变量赋值形式) var printAbc = function (){ console.log('ABC'); }; 注意:1.使用函数表达式形式时务必要有分号. 2.此时function后函数名可有可无,且

js - 02课 3

1. 自动生成5条新闻 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <input id="btn1" type="button" value="自动生成5条新闻"&

js - 02课 - 图片循环顺序切换实例

思路: 总结: 1. 给循环与否设置标识 isLoop ,true为循环 2. 下一张到最后一张的时候, 循环则 index 变成0 , 否则停留在最后一张,下标为arrImg.length-1 上一张到第一张的时候, 循环则跑到最后一张, 否则停留在第一张 3.当下标发生变化的时候, 哪些东西要改变? 图片 , 图片顶部的文字, 图片下面的文字信息 1. 效果 2. 代码 <!DOCTYPE html> <html lang="en"> <head>

浅谈JS之AJAX

0x00:什么是Ajax? Ajax是Asynchronous Javascript And Xml 的缩写(异步javascript及xml),Ajax是使用javascript在浏览器后台操作HTTP和web服务器进行数据交换(用户不知道也感觉不出来,就跟桌面应用程序似的进行数据交互),它不会导致页面重新加载,这样才有更好的用户体验. Ajax是基于以下开放标准: javascript(DOM) css html xml(json) 通俗的说就是使用了javascript(DOM)的XMLH

浅谈 js eval作用域

就简单聊下如何全局 eval 一个代码. var x = 1; (function () { eval('var x = 123;'); })(); console.log(x); 这个代码得到的是 1 而不是 123如果想让 eval 执行的代码是全局的,那么有几种方法. var x = 1; (function () { window.eval('var x = 123;'); })(); console.log(x); 这个方法标准浏览器都可以得到 123 而IE6-8则依然是 1 相同的

浅谈 js 正则之 test 方法

原文:浅谈 js 正则之 test 方法 其实我很少用这个,所以之前一直没注意这个问题,自从落叶那厮写了个变态的测试我才去看了下这东西.先来看个东西吧. ? 1 2 3 4 5 var re = /\d/; console.log( re.test("1") ); console.log( re.test("1") ); console.log( re.test("1") ); console.log( re.test("1"

浅谈 js 语句块与标签

原文:浅谈 js 语句块与标签 语句块是什么?其实就是用 {} 包裹的一些js代码而已,当然语句块不能独立作用域.可以详细参见这里<MDN block> 也许很多人第一印象 {} 不是对象字面量么?怎么成了语句块了?如果在赋值语句或者表达式里用的时候,确实是对象字面量,如: var a = {}; ({toString:function(){return "hehe"}}) + "..."; 是不是很有意思..但是直接使用如: {toString: fu