jQuery 选择器选中某节点,在后续的链式操作函数内使用 $(this) 的结果是 Window 对象,而非该节点对象
<ul class="tree-ocx">
<li class="tree-ocx-li" data-displayed="false">
<div class="tree-ocx-tip">分类</div>
<ul class="tree-ocx-body">
<li class="sub-category-item">设计作品</li>
<li class="sub-category-item">技巧杂烩</li>
<li class="sub-category-item">生活随笔</li>
</ul>
</li>
</ul>
当我们使用 JQ 选择器选中节点 A 之后,并为之添加点击事件on(events, hander)
。hander 参数接收一个箭头函数,在箭头函数中又需要选中此节点 A,为其添加一个 CSS 样式。$(this)
的 this 指向的并不是节点 A,而是Window
对象。
$(".tree-ocx-li").on("click", () => {
$(this).addClass("tree-ocx-li-active");
}
箭头函数箭头函数 - JavaScript | MDN没有自己的 this、arguments、super。所以,在箭头函数里面使用 this,其实就是 Window 对象。
把箭头函数换成普通函数,此时的this
就是函数本身,普通函数有箭头函数没有的东西,例如 arguments、super。普通函数可以使用 new,即构造器:
$(".tree-ocx-li").on("click", function () {
$(this).addClass("tree-ocx-li-active");
}
jQuery 选择器选中某节点,在后续的链式操作函数内使用 $(this) 的结果是 Window 对象,而非该节点对象的更多相关文章
- 如何一行jquery代码写出tab标签页(链式操作)
啦啦!今天又学了一招,js写几十行的tab标签页jquery写一行就行啦,用到了链式操作!以下是代码: <!DOCTYPE html> <html lang="en&quo ...
- jQuery链式操作[转]
用过jQuery的朋友都知道他强大的链式操作,方便,简洁,易于理解,如下 $("has_children").click(function(){ $(this).addClass( ...
- jQuery链式操作
讨论jQuery的文章很多.然而,关于jQuery的链式操作的文章并无多少.好的代码会带来速度的提升.快速渲染和响应意味着更好的用户体验. 下面就来讲讲jQuery的链式操作. 很多时候我们写代码的时 ...
- jquery中链式操作的this指向
jquery中链式操作是如何实现? 例如:$(obj).children().css('color','red').next().css('color','red').siblings().css(' ...
- jQuery链式操作如何返回上一级DOM
有时候我们在链式操作的时候,选择到了其他的DOM进行操作,如何再返回先前的dom呢,有一下几个方法,end(); addBack(); add(); 使用形式 $("#divFather&q ...
- JQUERY链式操作实例分析
本文实例讲述了jQuery链式操作.分享给大家供大家参考,具体如下: 从过去的实例中,我们知道jQuery语句可以链接在一起,这不仅可以缩短代码长度,而且很多时候可以实现特殊的效果. <scri ...
- jQuery对象的链式操作用法分析
可以使用下面的原则判断一个函数返回的时候是jQuery对象,即是否可以用于链式操作. 除了获取某些数据的函数,比如获取属性值"attr(name)",获取集合大小"siz ...
- jquery初级接触-----链式操作
设置一个初级菜单,点击显示本级菜单下的项目,被点击的同级其它菜单收起 html 代码: <!DOCTYPE html> <html lang="en"> & ...
- 强大的JQuery链式操作风格
实例代码 <style type="text/css"> #menu {width: 300px;} .has_children {background:#555;co ...
随机推荐
- 专家PID控制仿真学习
目录 专家控制 专家系统 专家控制 学习笔记,用于记录学习 资料:<智能控制>(第四版)--刘金琨 专家系统 一.专家系统的定义 专家系统是一类包含知识和推理的智能计算机程序,其内部包含某 ...
- STM32时钟系统配置程序源码深入分析
一.分析程序的目的 最近我在移植实时系统是遇到了一些问题,所以决定深入了解系统时钟的配置过程,当然想要学好stm32的小伙伴也有必要学习好时钟系统的配置,所以我将学习的过程再次记录,有写得不好的地方, ...
- MySQL数据库5
内容概要 pyhton操作MySQL SQL注入问题 修改表SQL语句补充 视图.触发器.储存过程 事务 流程控制 函数 索引与慢查询优化 内容详情 pyhton操作MySQL python中支持操作 ...
- 浏览器代理user-agent
两种方法: 法1:浏览器地址栏输入:about://version,然后复制用户代理: 如果法1不行,法2肯定可以. 法2:打开任意浏览器,输入任意网址,下面以火狐和百度网址为例来进行说明: 打开火狐 ...
- CVPR2022 | 可精简域适应
前言 在本文中,作者引入了一个简单的框架,即Slimmable Domain Adaptation,以通过权重共享模型库改进跨域泛化,从中可以对不同容量的模型进行采样,以适应不同的精度效率权衡.此外, ...
- dos命令-*02
1.cmd状态下 tab快速补充文件名 ↑↓快速填充之前输入的文件名 2.//这是Java的快速入门 //对代码的相关说明 //1.public class Hello 表示Hello是一个类,是一个 ...
- vlan配置
VLAN(Virtual Local Area Network)即虚拟局域网,是将一个物理的局域网在逻辑上划分成多个广播域的技术. 通过在交换机上配置VLAN,可以实现在同一个VLAN内的用户可以进行 ...
- flv.js的追帧、断流重连及实时更新的直播优化方案
目录 1. 前言 2. 前端直播 2.1 常见直播协议 2.2 flv.js 的原理 2.3 flv.js 的简单使用 3. flv.js 的优化方案 3.1 追帧-解决延迟累积问题 3.2 断流重连 ...
- windows版本rabbitmq安装及日志level设置
1.DirectX Repair 安装缺失的C++组件,不安装缺失的组件会造成第二部安装erl文件夹缺少bin文件夹2.安装otp_win64_23.1 1.配置 ERLANG_HOME:地址为Erl ...
- C++ 弹幕游戏
可能会持续更新吧,, 我们说一下固定弹,直线轨迹的做法 . 首先放一个 Kaguya 的波粒: 境符「波与粒的境界」 since C++98,系统要求 Windows . #include <c ...