JavaScript

超轻量级php框架startmvc

JavaScript 获取元素在父节点中的下标(推荐)

更新时间:2020-05-20 15:24:01 作者:startmvc
jQuery中直接通过$(this).index()即可得到当前元素的下标。但原生JavaScript并没有提供类似的属

jQuery中直接通过$(this).index()即可得到当前元素的下标。但原生JavaScript并没有提供类似的属性或方法,这时候可以调用数组中的indexOf方法直接计算


<ul>
 <li>hello</li>
 <li>hello</li>
 <li id="mts">hello</li>
 <li>hello</li>
</ul>
var elt=document.getElementById('mts');
var index=var index = [].indexOf.call(elt.parentNode.querySelectorAll(elt.tagName),elt);
console.log(index);

这里是计算elt在其父节点下,相同标签的元素中的位置。首先通过var list=elt.parentNode.quertSelectorAll('li')获得同类标签的列表,这里如果直接执行list.indexOf(elt)的话会出错,提示list没有indexOf这个函数,这时候可以借用数组中的indexOf,通过call改变调用者对象:[].indexOf.call(list,elt)等价于list.indexOf(elt)

以上所述是小编给大家介绍的JavaScript 获取元素在父节点中的下标,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

javascript 父节点 js获取元素父节点
基础信息
请求
SQL查询
加载文件
配置
错误
总耗时: 103.57ms 内存: 87.15KB
请求方法: GET
请求URI: /article_23719.html
控制器: index
方法: index
PHP版本: 8.0.26
服务器: nginx/1.24.0
GET参数
无GET参数
POST参数
无POST参数
请求头
Accept-Encoding: gzip, br, zstd, deflate
User-Agent: Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)
Accept: */*
Host: startmvc.com
Content-Length:
Content-Type:
Cookie
无Cookie数据
SELECT id,name FROM sm_article_category 0.00ms
SELECT a.id,a.category_id,a.title,a.keywords,a.description,a.update_time,ac.content FROM sm_article as a JOIN sm_article_content as ac ON ac.article_id = a.id WHERE a.id = '23719' LIMIT 1 0.00ms
SELECT tag_id FROM sm_tag_article WHERE article_id = '23719' 0.03ms
select id,title from sm_article where id in (select article_id from sm_tag_article where tag_id=13104) and status=1 order by id desc limit 20 0.00ms
总计:4 条SQL语句 总耗时:0.03 ms
1. /www/wwwroot/startmvc.com/public/index.php
2. /www/wwwroot/startmvc.com/startmvc/boot.php
3. /www/wwwroot/startmvc.com/startmvc/function.php
4. /www/wwwroot/startmvc.com/vendor/autoload.php
5. /www/wwwroot/startmvc.com/vendor/composer/autoload_real.php
6. /www/wwwroot/startmvc.com/vendor/composer/platform_check.php
7. /www/wwwroot/startmvc.com/vendor/composer/ClassLoader.php
8. /www/wwwroot/startmvc.com/vendor/composer/autoload_static.php
9. /www/wwwroot/startmvc.com/startmvc/core/Config.php
10. /www/wwwroot/startmvc.com/config/common.php
11. /www/wwwroot/startmvc.com/startmvc/core/Session.php
12. /www/wwwroot/startmvc.com/startmvc/core/App.php
13. /www/wwwroot/startmvc.com/startmvc/core/Exception.php
14. /www/wwwroot/startmvc.com/function/custom_function.php
15. /www/wwwroot/startmvc.com/function/global_function.php
16. /www/wwwroot/startmvc.com/startmvc/core/Request.php
17. /www/wwwroot/startmvc.com/startmvc/core/Middleware.php
18. /www/wwwroot/startmvc.com/startmvc/core/Router.php
19. /www/wwwroot/startmvc.com/config/route.php
20. /www/wwwroot/startmvc.com/app/home/controller/ArticleController.php
21. /www/wwwroot/startmvc.com/app/common/BaseController.php
22. /www/wwwroot/startmvc.com/startmvc/core/Controller.php
23. /www/wwwroot/startmvc.com/startmvc/core/Loader.php
24. /www/wwwroot/startmvc.com/startmvc/core/View.php
25. /www/wwwroot/startmvc.com/config/view.php
26. /www/wwwroot/startmvc.com/startmvc/core/Db.php
27. /www/wwwroot/startmvc.com/config/database.php
28. /www/wwwroot/startmvc.com/startmvc/core/db/DbCore.php
29. /www/wwwroot/startmvc.com/startmvc/core/db/DbInterface.php
30. /www/wwwroot/startmvc.com/runtime/temp/home/article/detail.php
31. /www/wwwroot/startmvc.com/startmvc/core/tpl/trace.php
总计:31 个文件
系统配置
运行环境: development
调试模式: 开启
时区设置: Asia/Shanghai
最大执行时间: 300秒
内存限制: 128M
上传限制: 50M
POST限制: 50M
字符集: UTF-8
错误报告级别: 32759
缓存状态
APC: 不可用
Memcached: 不可用
Redis: 不可用
OPcache: 可用
XCache: 不可用
File Cache: 可用
Autoload: 1 个加载器
Session: 已激活
框架配置
session: [Array]
trace: 1
debug: 1
default_controller: Index
default_action: index
异常信息
未捕获到异常
错误信息
未发现错误
应用运行正常,未发现错误或异常
103.57ms