js 动态生成div显示id
<!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的更多相关文章
- 【转】AngularJS动态生成div的ID
AngularJS动态生成div的ID 原文链接:http://blog.csdn.net/you23hai45/article/details/52348078 1.问题背景 给定一个数组对象,里面 ...
- JaveWeb 公司项目(7)----- 通过JS动态生成DIV
Web网页项目的数据表格功能已经大体完成,下面是另一个主要功能,在线视频的显示 目前我做的项目是渔政监控方面,在之前C#的版本中已经实现了摄像头的在线监控,用的海康封装好的SDK,目前需要做的工作是在 ...
- qrcode.js 动态生成二维码
用qrcode.js动态生成二维码图片非常简单,只需要引入qrcode.js即可使用,而且可以自定义图片大小.背景色等信息. 1.jsp代码---页面头部引入qrcode.js,jquery文件可选 ...
- js动态生成数据列表
我们通常会使用table标签来展示数据内容,由于需要展示的数据内容是随时更换的,所以不可能将展示的数据列表写死在html写死在页面中,而是需要我们根据后台传来的数据随时更换,这个时候就需要我们使用js ...
- js 动态生成html 触发事件传参字符转义
通常,在使用 JS 动态生成 html 的过程中,会嵌入相应的样式.事件等属性元素,而这时经常会出现所谓的 “单.双引号不够用” 的情况,别急,这时可以利用 html 语言中的转义字符来解决.下面就来 ...
- js动态生成下拉列表
经常需要用到js动态生成下拉列表的功能,记录下来备用. 示例需求:通过ajax请求,从后台获取用户姓名列表,并添加到下拉列表中.js代码如下: function getNameList(){ //如果 ...
- JS动态生成的元素,其对应的方法不响应(比如单击事件,鼠标移动事件等)
主要原因:在页面给元素注册点击事件的时候[ $(function () { XXX }); ],JS动态生成的元素还尚未生成,所以click事件就没有生效 解决方法: 方案一:js动态生成元素后再给 ...
- 抓取Js动态生成数据且以滚动页面方式分页的网页
代码也可以从我的开源项目HtmlExtractor中获取. 当我们在进行数据抓取的时候,如果目标网站是以Js的方式动态生成数据且以滚动页面的方式进行分页,那么我们该如何抓取呢? 如类似今日头条这样的网 ...
- 2)JS动态生成HTML元素的爬取
2)JS动态生成HTML元素的爬取 import java.util.List; import org.openqa.selenium.By; import org.openqa.selenium.W ...
随机推荐
- RabbitMQ 服务
RabbitMQ 使用场景一 安装环境 1.下载安装 Erlang 运行时环境 2.下载安装 RabbitMQ Server 应用程序 3.启动 RabbitMQ 服务(默认启动) 4.安装管理平 ...
- 解决IE6下PNG透明的JS插件:DD_belatedPNG.js
DD_belatedPNG是一款解决IE6下PNG透明的JS插件,支持background-position和background-repeat属性,支持伪类.使用方法: <!--[if lte ...
- [Angular] Observable.catch error handling in Angular
import { Observable } from 'rxjs/Observable'; import 'rxjs/add/operator/map'; import 'rxjs/add/opera ...
- AE中网络分析的实现 的各个类之间的关系
原文AE中网络分析的实现 的各个类之间的关系 1. 创建网络数据集 在ArcCatalog中勾选网络分析模块,新建个人地理信息数据库—>新建要素数据集—>批量导入要素—>创建 ...
- ssh连接上腾讯云、华为云Linux服务器,一会就自动断开
客户端向服务端发送心跳 依赖 ssh 客户端定时发送心跳,putty.SecureCRT.XShell 都有这个功能. Linux / Unix 下,编辑 ssh 配置文件: # vim /etc/s ...
- svn删除文件或文件夹后提交失败及解决
svn删除文件夹后提交显示Item 'XXXX' is out of date 有这么几种可能, 1.别人已经提交代码.恰好这个文件或文件夹有改动,这样的情况须要先回复再更新再删除再提交. 2.没有人 ...
- zookeeper 分布式安装/配置/启动
版本3.4.10,已提前配置好jdk 三台主机:hadoop002,hadoop003.hadoop004 1.配置 将zookeeper-3.4.10.tar.gz解压后进入zookeeper-3. ...
- 经Gradle采取Jenkins的build
如今,企业都太多Jenkins去管理apk,后该代码被提交jenkins在生成build 因此,我们可以得到jenkins提交版本 Jenkins在编制job什么时候,有一个内置的可变BUILD_NU ...
- 数据集成工具:Teiid实践
数据集成是把不同来源.格式.特点性质的数据在逻辑上或物理上有机地集中,从而为企业提供全面的数据共享.数据集成的方式多种多样,这里介绍的 Teiid 是其中的一种:通过抽象和联邦技术,实现分布式数据源的 ...
- H∞一般控制问题的鲁棒叙述性说明
Robust Control System:反馈控制有承受一定类不确定能力的影响,这一直保持在这种不确定的条件(制)稳定.动态特性(灵敏度)和稳态特性(逐步调整)的能力. 非结构不确定性(Unstru ...