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


Posted in Javascript onJuly 17, 2013

方法一:

<!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>
Javascript 相关文章推荐
jQuery Autocomplete自动完成插件
Jul 17 Javascript
button没写type=button会导致点击时提交
Mar 06 Javascript
js实现ArrayList功能附实例代码
Oct 29 Javascript
通过实例理解javascript中没有函数重载的概念
Jun 03 Javascript
JavaScript中setFullYear()方法的使用详解
Jun 11 Javascript
JS实现网页右侧带动画效果的伸缩窗口代码
Oct 29 Javascript
跨域请求的完美解决方法(JSONP, CORS)
Jun 12 Javascript
JS数组排序方法实例分析
Dec 16 Javascript
浅谈箭头函数写法在ReactJs中的使用
Aug 22 Javascript
使用Vue Composition API写出清晰、可扩展的表单实现
Jun 10 Javascript
利用JavaScript为句子加标题的3种方法示例
Jan 05 Javascript
TypeScript实用技巧 Nominal Typing名义类型详解
Sep 23 Javascript
基于pthread_create,readlink,getpid等函数的学习与总结
Jul 17 #Javascript
jcrop基本参数一览
Jul 16 #Javascript
jQuery实现鼠标滑过遮罩并高亮显示效果
Jul 16 #Javascript
jquery特效 幻灯片效果示例代码
Jul 16 #Javascript
jQuery .attr()和.removeAttr()方法操作元素属性示例
Jul 16 #Javascript
js判断屏幕分辨率的代码
Jul 16 #Javascript
js 调用父窗口的具体实现代码
Jul 15 #Javascript
You might like
过滤掉PHP数组中的重复值的实现代码
2011/07/17 PHP
让焦点自动跳转
2006/07/01 Javascript
Extjs中使用extend(js继承) 的代码
2012/03/15 Javascript
js 文本滚动效果的实例代码
2013/08/17 Javascript
jquery 取子节点及当前节点属性值
2014/07/25 Javascript
javascript实现对表格元素进行排序操作
2015/11/18 Javascript
JavaScript使用链式方法封装jQuery中CSS()方法示例
2017/04/07 jQuery
微信小程序 开发MAP(地图)实例详解
2017/06/27 Javascript
js图片放大镜实例讲解(必看篇)
2017/07/17 Javascript
关于TypeScript中import JSON的正确姿势详解
2017/07/25 Javascript
js实现图片轮播效果学习笔记
2017/07/26 Javascript
微信小程序适配iphoneX的实现方法
2018/09/18 Javascript
详解TypeScript+Vue 插件 vue-class-component的使用总结
2019/02/18 Javascript
elementUI Tree 树形控件的官方使用文档
2019/04/25 Javascript
微信小程序使用npm包的方法步骤
2019/08/13 Javascript
解决父组件将子组件作为弹窗调用只执行一次created的问题
2020/07/24 Javascript
ES11屡试不爽的新特性,你用上了几个
2020/10/21 Javascript
Python下rrdtool模块的基本使用方法
2015/11/13 Python
Django基础知识 URL路由系统详解
2019/07/18 Python
DJANGO-URL反向解析REVERSE实例讲解
2019/10/25 Python
安装PyInstaller失败问题解决
2019/12/14 Python
python框架Django实战商城项目之工程搭建过程图文详解
2020/03/09 Python
python + selenium 刷B站播放量的实例代码
2020/06/12 Python
Python基于内置函数type创建新类型
2020/10/22 Python
CSS3中线性颜色渐变的一些实现方法
2015/07/14 HTML / CSS
韩国流行时尚女装网站:Dintchina(中文)
2018/07/19 全球购物
Linux Interview Questions For software testers
2012/06/02 面试题
科级干部考察材料
2014/02/15 职场文书
大学开学计划书
2014/04/30 职场文书
五四青年节的活动方案
2014/08/20 职场文书
2014年文员工作总结
2014/11/18 职场文书
公司开会通知
2015/04/20 职场文书
2016大学先进团支部事迹材料
2016/03/01 职场文书
《狼王梦》读后感:可怜天下父母心
2019/11/01 职场文书
python 使用Tensorflow训练BP神经网络实现鸢尾花分类
2021/05/12 Python
Python爬虫实战之爬取京东商品数据并实实现数据可视化
2021/06/07 Python