js检查页面上有无重复id的实现代码_javascript技巧

方法一:

复制代码 代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
  <TITLE> New Document </TITLE>
  <script type="text/javascript">
    window.onload = function(){
        var tags = document.getElementsByTagName("*"),
            count = tags.length, time, ret = {}, id;
        time = new Date();
        for(var i = 0; i < count; i++){
            id = tags[i].id;
            if(id){
                if(ret[id]){
                    alert(id + "/n用时:" + (new Date() - time));
                    return;
                }else{
                    ret[id] = true;
                }
            }
        }
        alert("未找到相同ID");
    }
  </script>
</HEAD>
<BODY>
  <script type="text/javascript">
    (function(){
        var html = [], rnd = parseInt(Math.random() * 1000);
        for(var i = 0; i < 1000; i++){
            html.push("<div id='a" + i + "'>" + i + "</div>");
        };
        //在随机位置插入一个随机的id
        i = parseInt(Math.random() * 1000);
        html[i] = html[i] + ("<div id='a" + rnd + "'>" + rnd + "</div>");
        document.write(html.join(""));
    })();
  </script>
</BODY>
</HTML>

方法二:

复制代码 代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
  <TITLE> New Document </TITLE>
  <script type="text/javascript">
    function createDiv(){
        var html = [], id;
        for(var i = 0; i < 2000; i++){
            id = "divId" + parseInt(Math.random() * 10000);
            html.push("<div id='" + id + "'>" + id + "</div>");
        }
        document.body.innerHTML = html.join("");
    }
    window.onload = function(){
        createDiv();

        var oID = {} , result = {}, arr = [],
            tags = document.getElementsByTagName("*");
        for(var i = 0, id; i < tags.length; i++){
            id = tags[i].id;
            if(id){
                oID[id] = oID[id] ? oID[id] + 1 : 1;
                if(oID[id] > 1){
                    result[id] = id + " " + oID[id]; } } } for(var o in result){
            arr.push(result[o]);
        }
        alert(arr.join("/t"));
    };
  </script>
</HEAD>
<BODY>
</BODY>
</HTML>

时间: 2024-11-14 20:50:29

js检查页面上有无重复id的实现代码_javascript技巧的相关文章

js检查页面上有无重复id的实现代码

有时候我们需要检查一个页面上是否用重复的id,一般id都是唯一的,也方便控制,那么就可以参考下面的代码   方法一: 复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD>   <TITLE> New Document </TITLE>   <script type="text/javascr

JS获取键盘上任意按键的值(实例代码)_javascript技巧

废话不多说,直接上代码 复制代码 代码如下: function keyUp(){         if(navigator.appName == "Microsoft Internet Explorer"){        var keycode = event.keyCode;                }else{         varkeycode = keyUp.caller.arguments[0].which;            }       alert(key

js形成页面的一种遮罩效果实例代码_javascript技巧

用这锻代码 之前请先下载jquery库 复制代码 代码如下: var maskStackCount = 0; function mask(method){ //这里是你想要进行遮罩的窗口,我这里想要遮罩的是一个iframe窗口,也可以用var winObj=$(window) var winObj=window.top.$("body").find("iframe[name='dialognormaliframe']");         if(typeof met

JS实现网页上随机产生超链接地址的方法_javascript技巧

本文实例讲述了JS实现网页上随机产生超链接地址的方法.分享给大家供大家参考,具体如下: 这是一个JavaScript的应用,每刷新一次页面,会自动更换一次链接,虽然不常用,不过对Javascript随机函数Math.random() 的使用将直到引导作用. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-math-rand-url-show-codes/ 具体代码如下: <html> <head> <title>在

JS实现页面进入和返回定位到具体位置_javascript技巧

其实浏览器也自带了返回的功能,也就是说,自带了返回定位的功能.正常的跳转,返回确实可以定位,但是有些特殊场景就不适用了.例如,某些元素是在某种情况下才加上的,又或者多级定位. 目前,我知道的返回定位到具体位置有两种方法: ①利用id定位,在跳转的时候带上某个模块的id,返回的时候定位到该处. ②利用距离顶部的距离,在跳转的时候带上当前位置滚动过的距离,返回的时候定位到该处. 一般应用场景: 定位到某一个模块的时候,有二级定位的时候利用方法①. 定位到具体位置的时候,定位到某一个模块的时候,利用方

js实现页面跳转的几种方法小结_javascript技巧

按钮式: <INPUT name="pclog" type="button" value="GO" onClick="location.href='http://www.jb51.net/'"> 链接式: <a href="javascript:history.go(-1)">返回上一步</a> <a href="<%=Request.ServerV

js实现页面跳转的五种方法推荐_javascript技巧

js实现页面跳转的五种方法推荐 第一种: 复制代码 代码如下: <script language="javascript" type="text/javascript"> window.location.href="xx.jsp?backurl="+window.location.href; </script> 第二种: 复制代码 代码如下: <script language="javascript&quo

js实现文件上传表单域美化特效_javascript技巧

一款效果非常时尚的文件上传表单域美化特效,下面给出制作的简要教程. 先上几个效果饱饱眼福: 使用方法 这些文件上传域的美化使用的方法都是隐藏原生的<input type="file">元素,然后使用一个<label>元素来制作美化效果. HTML结构 该文件上传域美化效果最基本的HTML结构如下: <input type="file" name="file" id="file" class=&qu

JS实现页面跳转参数不丢失的方法_javascript技巧

本文实例讲述了JS实现页面跳转参数不丢失的方法.分享给大家供大家参考,具体如下: 需求:页面编辑后,返回列表页面,参数不丢失,能够记住页数以及筛选条件. 我坚信,不管白猫黑猫,能捉到耗子的就是好猫,当然如果能够高效的,简单的处理最好. 我的思路就是,把列表页面地址作为参数传递过去. 这里就会面临一个问题,url本身就是由多个参数组成的,这样纯粹的传递,就会出问题,参数丢失. 所以要对url进行加密. escape().encodeURI().encodeURIComponent() JavaSc