本文实例讲述了js动态创建及移除div的方法。分享给大家供大家参考。具体实现方法如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
//创建div
function createDiv(){
 if(document.getElementByIdx_x("newD")!=null)
  document.body.removeChild(document.getElementByIdx_x("newD"));
 var Div = document.create_rElement("div");//创建div
 Div.setAttribute("id", "newD");
 Div.style.position = "absolute";
 Div.style.height = "160px";
 Div.style.width = "400px";
 Div.style.border = "1px solid grey";
 Div.style.background = "white";
 Div.style.paddingTop = "40px";
 Div.style.zIndex = "100";
 Div.style.left = 100 +"px";//注意Firefox下必须加"px"
 Div.style.top = 100 +"px";
 Div.style.textAlign = "center";
 Div.style.fontSize = "18px";
 var str = "<div id=\"divClose\" onclick=\"removeDiv()\" style=\"width:16px;height:16px;float:right;margin-top:-40px;background:url(images/divClose.gif);\"><\/div>";
 Div.innerHTML = str + title;
 document.body.appendChild(newD);
}
//移除创建的div
function removeDiv(){
 document.body.removeChild(document.getElementByIdx_x_x("newD"));
}

js动态创建及移除div的方法的更多相关文章

  1. 用JS动态创建登录表单，报了个小错误

    后来发现原来是: dvObj.style.border='#Red 1px sold'; 其中的Red多谢了一个‘#’, 但是奇怪的是在chrome和firefox都备有报错,但是在ie中报错了. 各 ...

  2. UEditor js动态创建和textarea中渲染【原】

    UEditor动态创建和textarea中渲染 http://ueditor.baidu.com/website/examples/textareaDemo.html <!DOCTYPE> ...

  3. js动态创建表格,删除行列的小例子

    js动态创建表格,删除行列的实例代码. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

  4. js动态创建样式: style 和 link

    js动态创建样式: style 和 link ie6 不能 document.createElement('style') 然后append到head标签里.所以就找到这样个好文章 有很多提供动态创建 ...

  5. JS动态创建Table,Tr,Td并赋值

    JS动态创建Table,Tr,Td并赋值. 成果库修改: 要求主题列表随成果类型改变而改变 网上查询资料后开工,在成果类型下拉框添加change()事件触发Dwr,查询主题集合——动态创建/编辑Tab ...

  6. js 动态创建变量

      js 动态创建变量 CreationTime--2018年7月2日15点04分 Author:Marydon 1.实现方式 通过eval()实现 2.代码实现 /** * 声明一个函数 * @ex ...

  7. 通过js动态创建button

    通过js动态创建button 一.实例描述 通过JS的DOM对象,实现元素的动态创建. 二.效果 三.代码 <!DOCTYPE html> <html lang="zh-c ...

  8. js动态创建的select2标签样式加载不上解决办法

    js动态创建的select2标签样式加载不上:调用select2的select2()函数来初始化一下: js抛出了Uncaught query function not defined for Sel ...

  9. js动态给table添加/删除tr的方法

    js动态给table添加/删除tr的方法. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> ...

随机推荐

  1. 安装WP8 SDK出现“根据当前系统时钟或签名文件中的时间戳验证时要求的证书不在有效期内”的解决办法

    今天重装系统了,在安装WP8 SDK时,安装了一小部分就提示“根据当前系统时钟或签名文件中的时间戳验证时要求的证书不在有效期内”的错误. 根据错误提示,貌似跟时间有关,百度了下.果真.把系统时间往前调 ...

  2. Windows平台下为Python添加MySQL支持

    到Python官网下载MySQL-python-1.2.5.win32-py2.7.exe 安装MySQL-python-1.2.5.win32-py2.7 附 64位MySQL-python下载地址 ...

  3. [Linux]学习笔记（2）

    本节主要学习: whoami who am i who w users tty 6个命令的用法. (1)whoami whoami用于查询当前是以哪个用户登录Linux系统: [root@linuxf ...

  4. 解析php file_exists无效的解决办法

    php中file_exists无效的解决办法. 方法1 :据官方手册上描述若php教程的safe mode相关的设置过于苛刻,就会出现这样的情形:尽管文件真实存在也被误报,认为文件不存在. 由于服务器 ...

  5. Spark Streaming揭秘 Day6 关于SparkStreaming Job的一些思考

    Spark Streaming揭秘 Day6 关于SparkStreaming Job的一些思考 Job是SparkStreaming的重要基础,今天让我们深入,进行一些思考. Job是什么? 首先, ...

  6. 1054. The Dominant Color (20)

    时间限制 100 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue Behind the scenes in the compute ...

  7. 【socket】TCP 和 UDP 在socket编程中的区别

    一.TCP与UDP的区别 基于连接与无连接  对系统资源的要求(TCP较多,UDP少)  UDP程序结构较简单  流模式与数据报模式  TCP保证数据正确性,UDP可能丢包  TCP保证数据顺序,UD ...

  8. 手写快速排序（QuickSort）

    #include<iostream> #include<stdio.h> #include<algorithm> using namespace std; int ...

  9. JPA2 关于 PagingAndSortingRepository

    And --- 等价于 SQL 中的 and 关键字,比如 findByUsernameAndPassword(String user, Striang pwd): Or --- 等价于 SQL 中的 ...

  10. [转]控制反转(IOC)和依赖注入(DI)

    http://blog.csdn.net/Elite_1989/article/details/16851565 控制反转和依赖注入可以理解成同一个东西,都是为解耦而生的~ 控制反转(IoC=Inve ...