JS基础——索引值的应用

最新推荐文章于 2020-05-16 09:15:05 发布
最新推荐文章于 2020-05-16 09:15:05 发布
阅读量719 收藏
点赞数
分类专栏： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/raosheng1993/article/details/45422439
版权


[html] view plain copy 在CODE上查看代码片 派生到我的代码片
  1. <!doctype html>  
  2. <html>  
  3. <head>  
  4. <meta charset="utf-8">  
  5. <title>JS基础——索引值的应用</title>  
  6. <script>  
  7. window.onload = function(){  
  8.     var aBtn = document.getElementsByTagName('input');  
  9.     var arr = ['张三','李四','王五'];  
  10.       
  11.     for(var i=0; i<aBtn.length; i++){  
  12.         aBtn[i].index = i;  
  13.         aBtn[i].onclick = function(){  
  14.             //alert(this.index);  
  15.             this.value = arr[this.index];     
  16.         };    
  17.     }     
  18. };  
  19. </script>  
  20. </head>  
  21.   
  22. <body>  
  23. <!--input[value="按钮"]*3-->  
  24. <input type="button" value="按钮">  
  25. <input type="button" value="按钮">  
  26. <input type="button" value="按钮">  
  27. </body>  
  28. </html>  

思路：

首先获取相关元素，然后通过for循环出所有的按钮，然后给每个按钮添加一个自定义索引值，当点击按钮时，可以alert一下当前被点击按钮的索引值是多少（测试），

接着当点击按钮是，通过数组的索引值赋值给当前点击的按钮的value上。

ruby小酱
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
索引值应用
weixin_48235555的博客
07-01 414
添加索引值 1、index索引值 2、索引值运用：图片切换实例 思路一：全部清除 思路二：消除上一个 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <style> ul { padding:0; margin:0; } li { lis
索引值的应用
liudanyang_21的博客
07-15 68
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script> window.onload = function(){ var aBtn = document.getElementsByTagName('input');..
JavaScript索引值
从盲流子到程序员
12-30 898
&lt;!DOCTYPE HTML&gt; &lt;html&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt; &lt;title&gt;无标题文档&lt;/title&gt; &lt;script&gt; window.on
js相关知识点——yexk著1
最新发布
08-08
JavaScript是一种广泛应用于网页和网络应用开发的脚本语言，它主要负责客户端的交互逻辑。本文主要探讨了JavaScript中的几个核心知识点：Array数组对象、Date时间对象以及Math数学对象。 一、Array数组对象 在...
Javascript 读书笔记索引贴
10-29
以上内容构成了JavaScript学习的基础框架，涵盖了从基本概念到实际应用的各个方面。在深入学习过程中，还应关注其他关键点，如异步编程（回调、Promise、async/await）、模块化（CommonJS、AMD、ES6模块）、错误处理...
JS——字符串
06-08
JavaScript（简称JS）是一种轻量级的解释型编程语言，主要应用于网页和网络应用开发，尤其在客户端渲染和交互方面有着广泛的应用。在JS中，字符串是数据类型的一种，用于处理文本信息。本文将深入探讨JS中的字符串...
javascript基础知识大全
08-03
JavaScript是Web开发中不可或缺的一部分，它是一种轻量级的、解释型的编程语言，主要用于增强网页的交互性和动态...在实践中不断探索和学习，你将能够构建复杂的交互式Web应用，利用JavaScript的强大力量创造无限可能。
自学JavaScript基础语法笔记大全.rar
02-12
JavaScript，简称JS，是一种广泛应用于Web开发的轻量级编程语言，主要负责网页的动态交互。这份"自学JavaScript基础语法笔记大全"包含了学习JavaScript必备的知识点，旨在帮助初学者全面理解并掌握这门语言的核心...
javascript里使用索引对集合实现高效的增删改查
深南大道
04-24 440
<script> //集合操作 var list = [] var count = 10000 //集合数据总数 //索引方式添加 console.time("add") for (i = 0; i < count; i++) { addItem(list, { "name": "zhangsan" + i, ...
js解决元素索引值问题
超的博客
06-08 1328
今天在做评论列表的时候，想要获取某元素的索引，想起来原生js并没有JQuery中的index()函数。 解决方案，为nodelist中每个元素手动添加index属性 /** * 为nodelist添加索引 * @param {NodeList} nodelist 元素集合 */ function addIndex (nodelist) { const len = node...
Javascript中的索引，谈谈自己对索引的见解
github_39168243的博客
07-15 1455
检索 要检索对象中半酣的值，可以采用[]后缀中括住一个字符窜表达的方式。如果字符串表达式是一个常数，而且它是一个合法的JavaScript标识符而并非保留字，那么也可以用表示法代替。优先考虑使用 . 表示法代替。优先考虑使用 . 表示法，因为它更紧凑且可读性更好。 stooge["first-name"] //"JOE" flight.departure.IATA //"SY
js中index()的四种经典用法
热门推荐
透明大脑
06-21 4万+
Document 朕知道了 萌萌哒 不行你来咬我呀 你是猴子请来的逗逼吗 $("#nav a").click(function(){ //四个经典的用法 var index1 = $("#nav a").index(this); var index2 = $("#nav a").index($(this)); var index3 = $(thi
JavaScript中findIndex索引数据的妙用！
jacky
05-16 481
在数据交互中会经常遇到后端接口传来一个数据流，渲染页面只需要名称，但是提交保存的时候需要将编码和名称或其他数据一并提交，这种情况在实际项目中遇到的会非常频繁，恰巧，js为我们提供了一个方法，那就是findIndex！ 具体用法也比较简单，就一行代码！ const index = this.List.findIndex((v) => v.code === value) //定义索引 上面的value就是已经拿到的渲染到页面的值，然后index就是该值在list当中的索引，然后获取对应的其他值就很简单
使用JS获取数组的索引值index
g_hold的博客
07-11 3万+
var lis = getElementsByTagName("li")； for(var i=0;i&lt;lis.length;i++){ lis[i].index = i;//赋予每个li索引值,这是难点，比较难理解！ lis[i].onclick = function(){ alert(this.index); } }...
js获取索引值
qq_42091922的博客
12-26 1021
Speed = [3.2324,5.462,6734] Num = speed.indexOf(3.2324) &lt; 0
js使用索引操作多维数组
LHQ的博客
08-17 2853
多维数组理解成是一个 数组中的数组。当使用中括号[]去访问数组的时候，第一个[index]访问的是该数组中的第N个子数组，第二个[index]访问的是第N个子数组的第N个元素。（index为索引值从0开始） 例如： var arr = [ [1,2,3], [4,5,6], [7,8,9], [[10,11,12],13,14] ]; console.log...
js获取字符串索引indexOf用法
l_degege的专栏
05-30 1万+
https://www.cnblogs.com/dyqblog/p/5431824.html
掌握JavaScript数组基础：创建、操作与应用
本资源聚焦于JavaScript程序设计中的一个重要主题——数组。数组在JavaScript中是一种复合数据类型，用于在单一变量中存储一系列值，常被用于组织和处理数据集合。课程目标明确，旨在帮助学习者理解和掌握以下关键...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值