用闭包的写法弹出元素的索引值

最新推荐文章于 2024-08-11 18:40:36 发布
最新推荐文章于 2024-08-11 18:40:36 发布
阅读量79 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/ll-taj/p/5991750.html
版权

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="description" content="">
<meta name="keywords" content="">
<title>用闭包的写法弹出元素的索引值</title>
<!-- <script type="text/javascript" src="jquery-1.10.1.min.js"></script> -->
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
</head>
<script type="text/javascript">
// jquery写法；
// $(function() {
// $('li').click(function(event) {
// alert($(this).index());
// });
// });


// js原生写法一；
// window.οnlοad=function(){
// var aLi=document.getElementsByTagName('li');
// for (var i=0;i<aLi.length;i++) {
// var aa=function(i){
// aLi[i].οnclick=function(){
// // console.log(i);
// alert(i);
// };
// };
// aa(i);
// }
// }

// js原生写法二闭包；
window.οnlοad=function(){
var aLi=document.getElementsByTagName('li');
for (var i=0;i<aLi.length;i++) {
(function(i){
aLi[i].οnclick=function(){
// console.log(i);
alert(i);

};
})(i);
}
}

</script>
<body>
<ul>
<li>1111</li>
<li>1111</li>
<li>1111</li>
</ul>
</body>
</html>

转载于:https://www.cnblogs.com/ll-taj/p/5991750.html

weixin_30655569
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
闭包自定义alert 弹出框
04-17
闭包自定义alert 弹出框
实现点击列表弹出列表索引的两种方式
10-27
使用利用事件冒泡委托给列表的父节点去处理的方式第二种方式就是使用闭包了，感兴趣的你可以参考下本文，或许对你学习js有所帮助
闭包的应用-点击每个li标签，弹出索引值（一）
u010513603的博客
12-21 1666
点击每个li标签，弹出索引值 ul> li>123li> li>456li> li>789li> li>010li> ul> 错误的方法     "http://www.w3.org/TR/xhtml1/DTD/xhtml
利用闭包实现点击li输出对应索引
Anana13的博客
08-20 553
<body> <ul class="nav"> <li>javaScript</li> <li>C语言</li> <li>Java</li> <li>Vue</li> </ul> <script> var lis = document.querySelector('.nav').querySelectorAll('
闭包应用-点击li输出当前li的索引号
weixin_43837268的博客
09-22 318
// 闭包应用-点击li输出当前li的索引号 // 1. 我们可以利用动态添加属性的方式 var lis = document.querySelector('.nav').querySelectorAll('li'); for (var i = 0; i < lis.length; i++) { lis[i].index = i; lis[i].onclick = function() {...
js学习笔记--闭包应用(点击li输出索引号)
anan7410的博客
04-15 410
闭包(closure)指有权访问另一个函数作用域中的函数 一个作用域可以访问另一个函数的局部变量 fn外面的作用域可以访问fn内部的局部变量 闭包的主要作用：延伸了变量的作用范围 <body> <ulclass="nav"> <li>榴莲</li> <li>臭豆腐</li> <li>鲱鱼罐头</li> ...
两种点击弹出下标的方法（涉及闭包问题）
qiqi学习园地
09-14 937
方法1：**首先得有许多兄弟元素以供点击** var length=olis.length;//记录长度 for (var i=0;i<length;i++) { //下标属性方法 olis[i].xiabiao=i; olis[i].onclick=function(){
闭包（闭包/闭包循环的索引值/ 闭包做私有变量计时器/闭包做选项卡）
weixin_43152725的博客
01-09 222
闭包 &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;闭包&lt;/title&gt; &lt;script type="text/javascript"&gt; /* 闭包
C# 中闭包问题
菜鸟葫芦娃
11-11 6154
C# 中闭包问题 委托
微信小程序 闭包写法详细介绍
11-26
微信小程序 闭包写法 在入口处的 app.js 中定义了一个获取用户 OpenId 的函数，在微信的登录接口 wx.login 中发起网络请求。这个函数传入一个回调函数 cb getOpenIdData: function(cb) { var that = this //调用...
JS实现点击li标签弹出对应的索引功能【案例】
10-17
在JavaScript编程中，实现点击`<li>`标签弹出对应的索引功能是一项常见的交互需求，尤其是在构建列表式用户界面时。这个案例通过两种方法详细解释了如何实现这一功能，同时也涉及到了JavaScript事件响应、元素遍历等...
js实现点击每个li节点，都弹出其文本值及修改
10-20
本文将详细介绍如何使用JavaScript实现点击每个`<li>`节点时，弹出该节点的文本值，并根据特定规则进行文本值的修改。 首先，我们需要获取页面上所有的`<li>`节点。在JavaScript中，可以使用`document....
Element学习（布局组件、案例操作）（4）
m0_74363339的博客
08-08 384
value：表示输入的值，提交表单后传给服务器的值——>"男"表示1，"女"表示2。定义数据模型时，对象要使用大括号。像这里searchForm: {....}3、这一步之后的效果展示（只是空有一个布局——>目前还没有任何的内容）2、找到这种布局对应的代码（复制——>粘贴到标签<div>中）5、 在主展示区域的上方添加"员工查询"的（且独占一行）表单。还有一个当点击"查询"按钮时，会触发一个方法，也要去声明。7、给表格增加一个边框——>加入border属性即可。6、日期选择器——>(官网中组件中找)
Arco Design for Vue 3 - 快速上手指南与实战技巧
最新发布
qq_42072014的博客
08-11 413
如果你在使用 TypeScript 时遇到了类型定义问题，确保你安装了正确的类型包，并且版本与 Arco Design 的版本相匹配。Arco Design for Vue 3 是一个非常强大的 UI 框架，它不仅提供了丰富的组件和功能，还有完善的文档和支持。通过本文，你已经掌握了如何快速上手 Arco Design，并学会了一些实用的技巧来提升你的开发效率。希望这些经验能帮助你在 Vue 3 的开发过程中更进一步！
牛客JS题（三十四）监听对象
不起眼小菜菜的博客
08-10 410
注释很详细，直接上代码……
Vue项目通过宝塔部署之后，页面刷新后浏览器404页面
水w的博客
08-07 304
Vue项目通过宝塔部署之后，页面刷新后浏览器404页面
【Vue3】图片未加载成功前占位
菜就多练
08-08 323
原生img标签可以通过自定义指令解决< template > < img class = " image_item-img " v-preload = " ' loading' " src = " https://xx " alt = " 加载失败 " /> < script setup > import {reactive } from 'vue' // 自定义图片占位 const vPreload = {
Ant-Design-Vue快速上手 指南+排坑（下）
Dingdangr的博客
08-10 457
确保你正确定义了校验规则。Ant Design Vue 3.x 及以上版本推荐使用Form.Item的rules属性来定义校验规则，这是一个数组，可以包含多个校验项。html复制代码label="用户名":rules="[{ required: true, message: '请输入用户名!' }, { min: 3, message: '用户名至少为3个字符!' }]"如果 Ant Design Vue 提供的校验规则不满足你的需求，你可以自定义校验规则。
使用闭包访问属性，如何获得新值
06-09
如果你使用闭包来访问一个对象的属性时，闭包中存储的是该属性的引用，而不是该属性的值。如果在闭包外部修改了该属性的值，闭包中访问该属性时获取的是旧值。如果你想要在闭包中访问该属性时获得最新的值，可以使用 JavaScript 中的 getter 方法。 getter 方法是一种特殊的方法，用于获取对象的属性值。当你访问对象的属性时，JavaScript 引擎会自动调用该属性的 getter 方法，以获取最新的属性值。因此，如果你在闭包中访问一个对象的属性时，可以使用该属性的 getter 方法来获取最新的属性值。 例如，假设有一个对象 `obj`，其中包含一个属性 `value`。你可以使用以下方式定义该属性的 getter 方法： ```javascript var obj = { value: 0, get getValue() { return this.value; } }; ``` 在上面的代码中，`getValue` 方法是一个 getter 方法，用于获取对象的 `value` 属性的值。当你访问 `obj.getValue` 属性时，JavaScript 引擎会自动调用该 getter 方法，以获取最新的属性值。 如果你想在闭包中访问该属性时获得最新的值，可以使用以下方式： ```javascript var obj = { value: 0, get getValue() { return this.value; } }; var getValue = obj.getValue; console.log(getValue()); // 0 obj.value = 1; console.log(getValue()); // 1 ``` 在上面的代码中，我们将 `obj.getValue` 赋值给了一个新的变量 `getValue`。在闭包中访问 `getValue` 时，JavaScript 引擎会自动调用该 getter 方法，以获取最新的属性值，因此可以获取到最新的值。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值