处理html 页面

 <body>

     <div class="main">

         <div class="up">

             <div class="black"></div>

         </div>

         <div class="down"></div>

         <div class="disp"></div>

         <input type="button" value="点击消失" onclick="abc()">

         <div id="test1" class="tt">

             <h1>abccccc</h1>

         </div>

     </div>

     <script>

        function abc() {

            let a = $('.tt')[0];

            console.log(a);

            let b = $("#test1");

            console.log(b);

            $('.tt').each((index,ele) => {

                console.log(ele);

            });

            $('.main').delegate('#test1','click',() => {

                console.log(this);

                console.log($(this));

            });

            $('.main').delegate('#test1','click',function ()  {

                console.log(this);

                console.log($(this));

            });

        }

     </script>

在使用jquery 给 class为main 元素的子元素添加点击事件

 $('.main').delegate('#test1','click',() => {

               console.log(this);

               console.log($(this));

           });

如果使用匿名箭头函数，this 指向了 window对象

使用正常写法的写法:

this的指向当前元素！

以前学习箭头函数，有讲到this的指向问题，真正的使用起来容易遗忘。

纸上得来终觉浅，绝知此事要躬行.

javascript 使用 匿名 箭头函数 this的变化的更多相关文章

  1. JavaScript 基础(七) 箭头函数 generator Date JSON

    ES6 标准新增了一种新的函数: Arrow Function(箭头函数). x => x *x 上面的箭头相当于: function (x){ return x*x; } 箭头函数相当于匿名函 ...

  2. JavaScript中的箭头函数

    1.定义 箭头函数相当于匿名函数,并且简化了函数定义.箭头函数有两种格式,一种像上面的,只包含一个表达式,连{ ... }和return都省略掉了.还有一种可以包含多条语句,这时候就不能省略{ ... ...

  3. JavaScript中的普通函数和箭头函数

    最近被问到了一个问题: javaScript 中的箭头函数 ( => ) 和普通函数 ( function ) 有什么区别? 我当时想的就是:这个问题很简单啊~(flag),然后做出了错误的回答 ...

  4. [ES6系列-02]Arrow Function：Whats this？(箭头函数及它的this及其它)

    [原创] 码路工人 大家好,这里是码路工人有力量,我是码路工人,你们是力量. 如果没用过CSharp的lambda 表达式,也没有了解过ES6,那第一眼看到这样代码什么感觉? /* eg.0 * fu ...

  5. JS中的普通函数和箭头函数

    最近被问到了一个问题: >javaScript 中的箭头函数 (=>) 和普通函数 (function) 有什么区别? 我当时想的就是:这个问题很简单啊~(flag),然后做出了错误的回答 ...

  6. 深入理解JavaScript中的箭头

    箭头函数可以使我们的代码更加简洁,如下: var sum = (a,b) => a+b; JavaScript 充满了我们需要编写在其他地方执行的小函数的情况. 例如: arr.forEach( ...

  7. JavaScript学习笔记（十二）——箭头函数（Arrow Function）

    在学习廖雪峰前辈的JavaScript教程中,遇到了一些需要注意的点,因此作为学习笔记列出来,提醒自己注意! 如果大家有需要,欢迎访问前辈的博客https://www.liaoxuefeng.com/ ...

  8. JavaScript ES6 Arrow Functions（箭头函数）

    1. 介绍 第一眼看到ES6新增加的 arrow function 时,感觉非常像 lambda 表达式. 那么arrow function是干什么的呢?可以看作为匿名函数的简写方式. 如: var ...

  9. javascript基础修炼（8）——指向FP世界的箭头函数

    一. 箭头函数 箭头函数是ES6语法中加入的新特性,而它也是许多开发者对ES6仅有的了解,每当面试里被问到关于"ES6里添加了哪些新特性?"这种问题的时候,几乎总是会拿箭头函数来应 ...

随机推荐

  1. 在主线程中慎用WaitForSingleObject (WaitForMultipleObjects)

    下面的代码我调试了将近一个星期,你能够看出什么地方出了问题吗?线程函数: DWORD WINAPI ThreadProc(    while(!bTerminate)    {        // 从 ...

  2. php判断网站收录情况

    php判断网站收录情况 <?php //检测网页是否被百度收录 function checkBaiduIndex($url){ $url='http://www.baidu.com/s?wd=' ...

  3. QTreeView/QTableView中利用QStandardItem实现复选框三种形态变化

    https://www.techieliang.com/2017/12/729/ 原文地址 using_checkbox_item.h /** * @file using_checkbox_item. ...

  4. RHEL生命周期管理 -- Should I stay, or should I go?

    1. RHEL的支持策略是怎么样的? 标准支持(一般7年)+ 延长支持(3年) 2. 升级RHEL的好处有哪些? More advantageous to upgrade completely to ...

  5. npm使用过程中的一些错误解决办法及npm常用命令和技巧

    node,npm在前端开发流程中提供了非常完善的自动化工具链,但是同样由于其复杂性导致有很多奇奇怪怪的问题.本文将记录使用过程中出现的一些问题及其解决方法备案. 国内由于gfw问题,导致很多国外的网站 ...

  6. 从golang-gin-realworld-example-app项目学写httpapi (五)

    https://github.com/gothinkster/golang-gin-realworld-example-app/blob/master/users/middlewares.go 中间件 ...

  7. ajax实现跨域请求

    因为现在一直用的mvc,所以就以mvc来说说ajax跨域提交. 首先说说跨域,简单说就是不同域名访问,比如在aaa.com访问bbb.com. 就拿招聘网站来说,分为两种用户,求职者和企业,求职者端是 ...

  8. Java学习---Java代码编写规范

    编码规范 1 前言为确保系统源程序可读性,从而增强系统可维护性,java编程人员应具有基本类似的编程风格,兹制定下述Java编程规范,以规范系统Java部分编程.系统继承的其它资源中的源程序也应按此规 ...

  9. VS无法加载Web项目

    在VS中修改Web项目的服务器设置时无法加载改Web项目,提示如下图 原因:因为项目中的EbcBuy.Bll.Users.WebApi.csproj.user文件并没有加入到版本控制文件,所以讲项目还 ...

  10. ZT extern "C"的用法解析

    extern "C"的用法解析 1.引言 C++语言的创建初衷是“a better C”,但是这并不意味着C++中类似C语言的全局变量和函数所采用的编译和连接方式与C语言完全相同. ...