<!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. PHP 根据对象属性进行对象数组的排序(usort($your_data, "cmp");)(inside the class: usort($your_data, array($this, "cmp")))

    PHP 根据对象属性进行对象数组的排序(usort($your_data, "cmp");)(inside the class: usort($your_data, array($ ...

  2. 【u004】数列

    Time Limit: 1 second Memory Limit: 128 MB [问题描述] 有这样一种数列A1.A2.A3.--An,其中A1=0,且对任意一项Ai满足|Ai-A(i+1)|=1 ...

  3. 【37%】【poj1436】Horizontally Visible Segments

    Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 5200   Accepted: 1903 Description There ...

  4. 【z01】铺地毯

    [问题描述] 为了准备一个独特的颁奖典礼,组织者在会场的一片矩形区域(可看做是平面直角坐标 系的第一象限)铺上一些矩形地毯.一共有 n 张地毯,编号从 1 到n .现在将这些地毯按照 编号从小到大的顺 ...

  5. DDoS ATTACK PROCESSING APPARATUS AND METHOD IN OPENFLOW SWITCH

    An OpenFlow switch in an OpenFlow environment includes an attack determination module to collect sta ...

  6. MySQL数据库备份详解

    原文:MySQL数据库备份详解 对于任何数据库来说,备份都是非常重要的 数据库复制不能取代备份的作用 比如我们由于误操作,在主数据库上删除了一些数据,由于主从复制的时间很短,在发现时,从数据库上的数据 ...

  7. N 个互异数的数组的平均逆序数

    N 个互异数的数组的平均逆序数为 N(N−1)/4 1. 简单证明 对于任意的数的表 L(5,8,9,6,4),以及其反序表 Lr(4,6,9,8,5),它们各自的逆序数分别为:6 ((5, 4), ...

  8. js Map 遍历

    1. 在知道的key的情况下遍历map自然就跟数组一样的访. 2.在不知道key的情况下遍历map(此情况更多吧)    2.1  for(var key in Map){  };  //第一种   ...

  9. 微信小程序唤起其他微信小程序 / 移动应用App唤起小程序

    微信小程序唤起其他微信小程序 / 移动应用App唤起小程序 1. 微信小程序唤起微信小程序 小程序唤起其他小程序很简单 先上链接 小程序跳转小程序 Navigator组件 推荐使用 小程序跳转小程序 ...

  10. C++调用IDL程序的做法(一)

    作者:朱金灿 来源:http://blog.csdn.net/clever101 IDL是一种数据分析和图像化应用程序及编程语言,先由美国ITT公司所有.最初在七十年代后期用于帮助科学家分析火星探险卫 ...