js动态创建及移除div的方法


Posted in Javascript onJune 03, 2015

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

//创建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"));
}

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
通过ifame指向的页面高度调整iframe的高度
Oct 05 Javascript
Code: write(s,d) 输出连续字符串
Aug 19 Javascript
验证javascript中Object和Function的关系的三段简单代码
Jun 27 Javascript
javascript动画之圆形运动,环绕鼠标运动作小球
Jul 20 Javascript
img onload事件绑定各浏览器均可执行
Dec 19 Javascript
js导出table到excel同时兼容FF和IE示例
Sep 03 Javascript
javaScript中with函数用法实例分析
Jun 08 Javascript
Bootstrap风格的WPF样式
Dec 07 Javascript
Vue.js实现一个todo-list的上移下移删除功能
Jun 26 Javascript
vue与原生app的对接交互的方法(混合开发)
Nov 28 Javascript
微信小程序与后台PHP交互的方法实例分析
Dec 10 Javascript
Vue图片浏览组件v-viewer用法分析【支持旋转、缩放、翻转等操作】
Nov 04 Javascript
JS实现窗口加载时模拟鼠标移动的方法
Jun 03 #Javascript
利用js实现禁止复制文本信息
Jun 03 #Javascript
详解JavaScript中循环控制语句的用法
Jun 03 #Javascript
讲解JavaScript中for...in语句的使用方法
Jun 03 #Javascript
JavaScript中for循环的使用详解
Jun 03 #Javascript
详解JavaScript的while循环的使用
Jun 03 #Javascript
jQuery中extend()和fn.extend()方法详解
Jun 03 #Javascript
You might like
PHP执行linux系统命令的常用函数使用说明
2010/04/27 PHP
PHP批量生成静态HTML的简单原理和方法
2014/04/20 PHP
解决ThinkPHP关闭调试模式时报错的问题汇总
2015/04/22 PHP
7个Javascript地图脚本整理
2009/10/20 Javascript
jQuery 白痴级入门教程
2009/11/11 Javascript
jQuery控制cookie过期时间的方法
2015/04/07 Javascript
javascript闭包功能与用法实例分析
2017/04/06 Javascript
Bootstrap里的文件分别代表什么意思及其引用方法
2017/05/01 Javascript
微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据(一)
2017/05/11 Javascript
Vue配合iView实现省市二级联动的示例代码
2018/07/27 Javascript
vue 的点击事件获取当前点击的元素方法
2018/09/15 Javascript
使用ECharts实现状态区间图
2018/10/25 Javascript
使用javascript做时间倒数读秒功能的实例
2019/01/23 Javascript
vue 表单之通过v-model绑定单选按钮radio
2019/05/13 Javascript
vue组件创建的三种方式小结
2020/02/03 Javascript
js实现聊天对话框
2020/02/08 Javascript
[01:01:24]DOTA2上海特级锦标赛A组败者赛 EHOME VS CDEC第三局
2016/02/25 DOTA
python中如何使用朴素贝叶斯算法
2017/04/06 Python
详解关于Django中ORM数据库迁移的配置
2018/10/08 Python
selenium+python环境配置教程详解
2019/05/28 Python
tensorflow之并行读入数据详解
2020/02/05 Python
浅谈Pytorch中的自动求导函数backward()所需参数的含义
2020/02/29 Python
CSS3 :nth-child()伪类选择器实现奇偶行显示不同样式
2013/11/05 HTML / CSS
借助HTML5 Canvas API制作一个简单的猜字游戏
2016/03/25 HTML / CSS
德国户外装备、登山运动和攀岩商店:tapir store
2020/02/12 全球购物
后勤人员自我鉴定
2013/10/20 职场文书
大学生预备党员自我评价分享
2013/11/16 职场文书
车间工艺员岗位职责
2013/12/09 职场文书
挑战杯创业计划书的写作指南
2014/01/07 职场文书
代办社保委托书范文
2014/10/06 职场文书
2014年绿化工作总结
2014/12/09 职场文书
2014年安置帮教工作总结
2014/12/11 职场文书
绿色环保倡议书
2015/04/28 职场文书
金榜题名主持词
2015/07/02 职场文书
Django drf请求模块源码解析
2021/06/08 Python
Django + Taro 前后端分离项目实现企业微信登录功能
2022/04/07 Python