一天一小段js代码(no.4)
最近在看网上的前端笔试题,借鉴别人的自己来试一下:
题目:
写一段脚本,实现:当页面上任意一个链接被点击的时候,alert出这个链接在页面上的顺序号,如第一个链接则alert(1), 依次类推。
有一点需要注意的是:在html中<a><area>标签中都有可能出现href
html中:
<!DOCTYPE html>
<html lang="zh" >
<head> <title>demo</title> <style type="text/css"> </style>
</head>
<body >
<div class="box">
<div class="item"><a href='#'>默认</a></div>
<div class="item"><a href='#'>销量</a></div>
<div class="item"><a href='#'>信用</a></div>
</div>
<script type='text/javascript' src='practice.js'></script>
</body>
</html>
js中:
var body = document.getElementsByTagName('body')[0],
links = document.getElementsByTagName('a'),
len = links.length; var foo = function(el){
var tagName = el.target.tagName.toLowerCase();
if((tagName==='a'||tagName==='area')&&el.target.href){
for(var i=0;i<len;i++){
if(links[i]===el.target){
alert(i+1);
}
}
}
}; body.addEventListener('click',foo,false);
我所看到的文章的作者写的特别好,他说,最好将事件监听函数添加在父级元素上,这样在连接比较多的时候也能够性能比较好,毕竟js的冒泡监听机制为我们提供了这个便利。
一天一小段js代码(no.4)的更多相关文章
- 一天一小段js代码(no.2)
(一)可以用下面js代码来检测弹出窗口是否被屏蔽: var blocked = false ; try { /*window.open()方法接受4个参数window.open(要加载的url,窗口目 ...
- 一天一小段js代码(no.1)
10000个数字中缺少三个数,编程找出缺少的三个数字. 算法实现: /*生成10000个数中随机抽掉三个数后的数组*/ function supplyRandomArray(){ /*生成含有1000 ...
- 一天一小段js代码(no.3)
//遍历属性,返回名值对 function outputAttributes(element){ var pairs = new Array(), attrName, attrValue, i, le ...
- 由一段JS代码引发的思考
不知道大家在编程的时候有没有遇到过这种情况,就是在循环遍历删除一部分内容的时候,发现只能删除其中一部分,而另一部分却总也删不掉,然后觉得自己的逻辑没有问题啊,于是陷入了深深的抑郁之中…… 昨天在处理一 ...
- 我要崩溃了,要解出这么一段js代码背后的东西,这真是一坨啊,别被高度欺骗了,他还有宽度!!!!!试着按下方向右键
一坨js代码: function s_gi(un, pg, ss) { var c = "s.version='H.26';s.an=s_an;s.logDebug=function(m){ ...
- 网页调试js时,如何知道某个事件对应哪段js代码?
有时候我们需要知道某个事件对应的js代码,比如点击一个div元素时,出现下拉框,我想知道这个功能对应的js代码,那就可以按下图操作: 勾选click事件,重新运行,那么就会在每个click事件那里设置 ...
- 用一段JS代码来比较各浏览器的极限内存与运算速度
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 防止横竖屏时,iphone自动缩放的一段js代码
function orientation_change() { var viewport = document.querySelector('meta[name="viewport& ...
- 一段js代码
原文地址 [].forEach.call($$("*"),function(a){ a.style.outline="1px solid #"+(~~(Math ...
随机推荐
- c++内存分布
http://www.oschina.net/translate/cpp-virtual-inheritance 编译器会加入一些代码, 指针的转换操作编译器会自动加偏移
- android的单击监听事件
Button button = (Button) findViewById(R.id.button1); //1.直接new出来 button.setOnClickListener(new View. ...
- UIAlertController、UIAlertAction 警告框
NS_CLASS_AVAILABLE_IOS(8_0) @interface UIAlertAction : NSObject <NSCopying> //创建操作 + (instan ...
- 使用.NET读取exchange邮件
公司有个第3方的系统,不能操作源码修改错误捕获,但是错误会发一个邮件出来,里面包含了主要的信息.于是想从邮件下手,提取需要的数据 开始考虑使用的是exchange service,主要参考http:/ ...
- ExecutorService中submit和execute的区别(转)
在Java5之后,并发线程这块发生了根本的变化,最重要的莫过于新的启动.调度.管理线程的一大堆API了.在Java5以后,通过Executor来启动线程比用Thread的start()更好.在新特征中 ...
- <转>简单之美——系统设计黄金法则
作者: 包云岗 发布时间: 2012-05-19 13:06 阅读: 3036 次 推荐: 1 原文链接 [收藏] 最近多次看到系统设计与实现的文章与讨论,再加上以前读过的其他资料以及自 ...
- Lisp 函数
(quote x) [返回x] >>>>>>>>>>>>>>>>>>>>> ...
- JavaScript标准库之——JSON
JSON 对象包含了两个方法,一是解析 JavaScript Object Notation (JSON),二是将值转换为 JSON.这个对象本身不能被调用或者作为构造函数,除了它的这两个方法属性外 ...
- java小结
1.UUID.randomUUID()是潜在线程安全的,SecureRandom.nextBytes()为synchronized
- [转] How to change font settings for all UI elements (toolbar and context menus, property editors, etc.)
https://www.devexpress.com/Support/Center/Question/Details/S35762