最近在看网上的前端笔试题，借鉴别人的自己来试一下：

题目：

写一段脚本，实现：当页面上任意一个链接被点击的时候，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）的更多相关文章

  1. 一天一小段js代码（no.2）

    (一)可以用下面js代码来检测弹出窗口是否被屏蔽: var blocked = false ; try { /*window.open()方法接受4个参数window.open(要加载的url,窗口目 ...

  2. 一天一小段js代码（no.1）

    10000个数字中缺少三个数,编程找出缺少的三个数字. 算法实现: /*生成10000个数中随机抽掉三个数后的数组*/ function supplyRandomArray(){ /*生成含有1000 ...

  3. 一天一小段js代码（no.3）

    //遍历属性,返回名值对 function outputAttributes(element){ var pairs = new Array(), attrName, attrValue, i, le ...

  4. 由一段JS代码引发的思考

    不知道大家在编程的时候有没有遇到过这种情况,就是在循环遍历删除一部分内容的时候,发现只能删除其中一部分,而另一部分却总也删不掉,然后觉得自己的逻辑没有问题啊,于是陷入了深深的抑郁之中…… 昨天在处理一 ...

  5. 我要崩溃了，要解出这么一段js代码背后的东西，这真是一坨啊，别被高度欺骗了，他还有宽度！！！！！试着按下方向右键

    一坨js代码: function s_gi(un, pg, ss) { var c = "s.version='H.26';s.an=s_an;s.logDebug=function(m){ ...

  6. 网页调试js时，如何知道某个事件对应哪段js代码？

    有时候我们需要知道某个事件对应的js代码,比如点击一个div元素时,出现下拉框,我想知道这个功能对应的js代码,那就可以按下图操作: 勾选click事件,重新运行,那么就会在每个click事件那里设置 ...

  7. 用一段JS代码来比较各浏览器的极限内存与运算速度

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. 防止横竖屏时，iphone自动缩放的一段js代码

    function orientation_change() {     var viewport = document.querySelector('meta[name="viewport& ...

  9. 一段js代码

    原文地址 [].forEach.call($$("*"),function(a){ a.style.outline="1px solid #"+(~~(Math ...

随机推荐

  1. 给angularJs的service建模

    先回顾一下我们遇到的问题: 通过一个dialogService创建对话框,并将该service的参数数据通过resolve的方式传递给对话框的controller. controller解析数据后放置 ...

  2. UVA11149_Power of Matrix

    题目简洁明了,给出矩阵,求前k次方和. 不知道这种方法是叫做二分幂还是倍增法,如果有知道的,请告诉我一下. 具体思想是这样的,A^1+A^2+A^3+......A^n=(E+A^(n/2))*(A^ ...

  3. UIAlertController、UIAlertAction 警告框

      NS_CLASS_AVAILABLE_IOS(8_0) @interface UIAlertAction : NSObject <NSCopying> //创建操作 + (instan ...

  4. MyBatis Generator 详解 【转来纯为备忘】

    版权声明:版权归博主所有,转载请带上本文链接!联系方式:abel533@gmail.com   目录(?)[+] MyBatis Generator中文文档 运行MyBatis Generator X ...

  5. MVC, MVP, MVVM比较以及区别

    MVC, MVP和MVVM都是用来解决界面呈现和逻辑代码分离而出现的模式.以前只是对它们有部分的了解,没有深入的研究过,对于一些里面的概念和区别也是一知半解.现在一边查资料,并结合自己的理解,来谈一下 ...

  6. MMC不能打开文件D:\Program Files\Microsoft SQL Server\80\Tools\BINN\SQL Server Enterprise Manager.MSC

    以上问题的解决方式如下: 1. 打开windows运行对话框.在对话框输入mmc.打开了如图所示的控制台. 2. 文件---添加/删除管理单元(M). 3. 添加.然后选择Microsoft SQL ...

  7. 异或链表(XOR linked list)

    异或链表(Xor Linked List)也是一种链式存储结构,它可以降低空间复杂度达到和双向链表一样目的,任何一个节点可以方便的访问它的前驱节点和后继结点.可以参阅wiki 普通的双向链表 clas ...

  8. Firebird数据库系统的开发团队

    下载Firebird3的发布文档,上面列出了开发团队,仔细看了看,原来俄罗斯人是主导(内核开发),法国人.智利人.巴西人.日本人.荷兰人.捷克人都有.共17人,3人全职. able 13.1. Fir ...

  9. hdu 2896 AC自动机

    // hdu 2896 AC自动机 // // 题目大意: // // 给你n个短串,然后给你q串长字符串,要求每个长字符串中 // 是否出现短串,出现的短串各是什么 // // 解题思路: // / ...

  10. 如何将APP部署在阿里云服务器

    1,APP应用需要什么样的云服务器? 为了帮助大家了解如何使用阿里云云服务器及相关应用,阿里云的移动云团队开发了一个简单的APP应用:移动云相册,其中使用了ECS主要用作部署云相册的API服务(图片信 ...