<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        onload = function () {
            var body = document.getElementsByTagName('body')[0];
            var ps = document.getElementsByTagName('p');
            var dv = document.createElement('div');
            dv.style.width = '100px';
            dv.style.height = '100px';
            body.appendChild(dv);
            dv.style.display = 'none';
            for (var i = 0; i < ps.length; i++) {
                ps[i].onmouseover = function (e) {
                    dv.style.position = 'absolute';                    
                    dv.style.left = e.clientX + 'px';
                    dv.style.top = e.clientY + 'px';
                    dv.innerHTML = this.id;
                    dv.style.display = 'block';

                };
                ps[i].onmouseout = function () {
                    dv.style.display = 'none';
                }
            }
        }
    </script>
</head>
<body>
   <p id="1">1</p>
   <p id="2">2</p>
   <p id="3">3</p>
   <p id="4">4</p>
   <p id="5">5</p>
</body>
</html>

js 动态生成div显示id的更多相关文章

  1. 【转】AngularJS动态生成div的ID

    AngularJS动态生成div的ID 原文链接:http://blog.csdn.net/you23hai45/article/details/52348078 1.问题背景 给定一个数组对象,里面 ...

  2. JaveWeb 公司项目（7）----- 通过JS动态生成DIV

    Web网页项目的数据表格功能已经大体完成,下面是另一个主要功能,在线视频的显示 目前我做的项目是渔政监控方面,在之前C#的版本中已经实现了摄像头的在线监控,用的海康封装好的SDK,目前需要做的工作是在 ...

  3. qrcode.js 动态生成二维码

    用qrcode.js动态生成二维码图片非常简单,只需要引入qrcode.js即可使用,而且可以自定义图片大小.背景色等信息. 1.jsp代码---页面头部引入qrcode.js,jquery文件可选 ...

  4. js动态生成数据列表

    我们通常会使用table标签来展示数据内容,由于需要展示的数据内容是随时更换的,所以不可能将展示的数据列表写死在html写死在页面中,而是需要我们根据后台传来的数据随时更换,这个时候就需要我们使用js ...

  5. js 动态生成html 触发事件传参字符转义

    通常,在使用 JS 动态生成 html 的过程中,会嵌入相应的样式.事件等属性元素,而这时经常会出现所谓的 “单.双引号不够用” 的情况,别急,这时可以利用 html 语言中的转义字符来解决.下面就来 ...

  6. js动态生成下拉列表

    经常需要用到js动态生成下拉列表的功能,记录下来备用. 示例需求:通过ajax请求,从后台获取用户姓名列表,并添加到下拉列表中.js代码如下: function getNameList(){ //如果 ...

  7. JS动态生成的元素，其对应的方法不响应（比如单击事件，鼠标移动事件等）

    主要原因:在页面给元素注册点击事件的时候[ $(function () {  XXX }); ],JS动态生成的元素还尚未生成,所以click事件就没有生效 解决方法: 方案一:js动态生成元素后再给 ...

  8. 抓取Js动态生成数据且以滚动页面方式分页的网页

    代码也可以从我的开源项目HtmlExtractor中获取. 当我们在进行数据抓取的时候,如果目标网站是以Js的方式动态生成数据且以滚动页面的方式进行分页,那么我们该如何抓取呢? 如类似今日头条这样的网 ...

  9. 2）JS动态生成HTML元素的爬取

    2)JS动态生成HTML元素的爬取 import java.util.List; import org.openqa.selenium.By; import org.openqa.selenium.W ...

随机推荐

  1. winscp ppk无需密码登录（失败）

    http://blog.csdn.net/catoop/article/details/8284803 按上文将Linux下生成的密钥文件id_rsa通过puttygen生成对应的.ppk文件,用wi ...

  2. 小强的HTML5移动开发之路（51）——jquerymobile中改善页面访问速度

    在使用jQuery Mobile进行开发的时候可以选择单页模版和多页模版,在使用单页模版的时候从一个页面跳转到另一个页面的时候需要从服务器请求,用户会感到略有停顿.使用多页模版,可以改善页面跳转之间的 ...

  3. 【t049】&&【u001】足球

    Time Limit: 1 second Memory Limit: 128 MB [问题描述] 我们当中有很多热爱中国足球的同学,我们都知道中超(中国足球超级联赛)的规则: 一场比赛中,若获胜(即你 ...

  4. Cocos2D－html5 公布游戏js编译为jsc

    搞了老半天.这么回事啊.工具都在tools中. jsb模式下是通过打包spidermonkey来执行JS代码的. JS文件都在assets目录中.我们都知道assets目录.打包后的结果,将apk包解 ...

  5. Expression Blend 的点滴（1）--ListBox华丽大变身

    原文:Expression Blend 的点滴(1)--ListBox华丽大变身 最近,在园子里有不少朋友写了关于Blend的优秀并且实用的文章,在此,我先代表silverlight的爱好者感谢他们的 ...

  6. boost_1_34_1在c++builder6编译（把所有dll文件复制到windows系统目录，所以lib文件复制到bcb6\lib目录）

    boost_1_34_1.zip boost 正则表达式 bcb6编译boost_1_34 有个项目要对大量的文本信息进行分析,以前的方法是自己写函数然后进行分析.现在发现一个正则表达式的处理方法,其 ...

  7. 【codeforces 787A】The Monster

    [题目链接]:http://codeforces.com/contest/787/problem/A [题意] 把b一直加a->得到x 把d一直加c->得到y 然后问你x和y可不可能有相同 ...

  8. android studio中文乱码各种情况的解决办法

    情况一:编辑器内的中文注释乱码. 解决办法:在界面的右下角找到 UTF-8 ,单击之,在弹出的列表中选中GBK 在弹出框内选中Reload 总结:导致这样的原因是你这个.java文件本身是GBK编码的 ...

  9. CUDA二维纹理内存+OpenCV图像滤波

    CUDA和OpenCV混合编程,使用CUDA的纹理内存,实现图像的二值化以及滤波功能. #include <cuda_runtime.h> #include <highgui/hig ...

  10. 【struts2+hibernate4】小型电子商务站点

    这里使用的是struts2和hibernate4两个框架开发的一个小型电子商务站点,数据库方面我也会给出对应的代码. 总之使用的是:struts2+hibernate4+jsp+MySQL+tomca ...