本文实例讲述了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. OCI-DML-更新数据库中不存在的字段

    用gtest来测试oracle中oci方式的SQL语句操作,在测试update数据库中不存在的异常案例的时候,日志没有报错,但是结束后跳出了数据库连接 gtest也没有给出正常的结果,本身update ...

  2. C++与Lua交互（三）

    通过上一篇的热身,我们对C++调用lua变量有了一个认识,现在让我们再深入一点,去探索一下如何调用lua的函数.表. Lua与宿主通讯的关键--栈 lua是个动态脚本语言,它的数据类型如何映射到C++ ...

  3. Java中的队列：java.util.Queue接口

    队列是一种特殊的线性表,它只允许在表的前端(front)进行删除操作,而在表的后端(rear)进行插入操作. Queue接口与List.Set同一级别,都是继承了Collection接口.Linked ...

  4. String inputStream file转化

    String --> InputStreamByteArrayInputStream stream = new ByteArrayInputStream(str.getBytes()); Inp ...

  5. STM8S003K3用Tim1的通道4输出20KHz的PWM波

    void Init_pwm(){TIM1_DeInit(); TIM1_TimeBaseInit(0, TIM1_COUNTERMODE_UP, 800, 0x00);//250 TIM1_OC4In ...

  6. Random类(java.util)

    转自 Random类中实现的随机算法是伪随机,也就是有规则的随机.在进行随机时,随机算法的起源数字称为种子数(seed),在种子数的基础上进行一定的变换,从而产生需要的随机数字. 相同种子数的Rand ...

  7. 九，WPF资源

    WPF资源的优点 WPF资源系统是一种保管一系列有用对象的简单方法,从而可以更容易地重用这些对象,它主要有以下优点: 高效,通过资源可以定义一个对象,并在标记中的多个地方重用,这会使代码变的更加精简, ...

  8. opencv学习笔记（02）——遍历图像（指针法）

    #include <opencv2\core\core.hpp> #include <opencv2\highgui\highgui.hpp> #include <ope ...

  9. C#网络编程简单实现通信小例子-1

    1.主界面 2.源程序 Send public partial class formUdpSend : Form { //声明一个UdpClient对象 UdpClient udpClient; pu ...

  10. 同时安装vs2010和VS2012后IEnumerable<ModelClientValidationRule>编译错误

    错误 类型“System.Web.Mvc.ModelClientValidationRule”同时存在于“c:\Program Files (x86)\Microsoft ASP.NET\ASP.NE ...