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 相关文章推荐
html中的input标签的checked属性jquery判断代码
Sep 19 Javascript
编写js扩展方法判断一个数组中是否包含某个元素
Nov 08 Javascript
JS实现同一个网页布局滑动门和TAB选项卡实例
Sep 23 Javascript
js实现获取div坐标的方法
Nov 16 Javascript
内容滑动切换效果jquery.hwSlide.js插件封装
Jul 07 Javascript
分享JS代码实现鼠标放在输入框上输入框和图片同时更换样式
Sep 01 Javascript
JS中parseInt()和map()用法分析
Dec 16 Javascript
js使用Replace结合正则替换重复出现的字符串功能示例
Dec 27 Javascript
Bootstrap下拉菜单Dropdowns的实现代码
Mar 17 Javascript
移动web开发之touch事件实例详解
Jan 17 Javascript
微信小程序实现同一页面取值的方法分析
Apr 30 Javascript
JS实现分页导航效果
Feb 19 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
mysql 搜索之简单应用
2007/04/27 PHP
php读取文件内容至字符串中,同时去除换行、空行、行首行尾空格(Zjmainstay原创)
2012/07/31 PHP
PHP文件去掉PHP注释空格的函数分析(PHP代码压缩)
2013/07/02 PHP
TP5框架页面跳转样式操作示例
2020/04/05 PHP
location.search在客户端获取Url参数的方法
2010/06/08 Javascript
利用JS自动打开页面上链接的实现代码
2011/09/25 Javascript
jQuery弹出层始终垂直居中相对于屏幕或当前窗口
2013/04/01 Javascript
jQuery中filter()方法用法实例
2015/01/06 Javascript
javascript实现简单的贪吃蛇游戏
2015/03/31 Javascript
nodejs通过phantomjs实现下载网页
2015/05/04 NodeJs
自定义事件解决重复请求BUG的问题
2017/07/11 Javascript
微信小程序scroll-view实现字幕滚动
2018/07/14 Javascript
微信小程序chooseImage的用法(从本地相册选择图片或使用相机拍照)
2018/08/22 Javascript
Jquery实现获取子元素的方法分析
2019/08/24 jQuery
layui给下拉框、按钮状态、时间赋初始值的方法
2019/09/10 Javascript
Jquery高级应用Deferred对象原理及使用实例
2020/05/28 jQuery
koa中间件核心(koa-compose)源码解读分析
2020/06/15 Javascript
vue实现前端分页完整代码
2020/06/17 Javascript
JavaScript 声明私有变量的两种方式
2021/02/05 Javascript
[47:45]DOTA2-DPC中国联赛 正赛 Phoenix vs Dragon BO3 第一场 2月26日
2021/03/11 DOTA
简单介绍Python中的decode()方法的使用
2015/05/18 Python
Python中函数的参数传递与可变长参数介绍
2015/06/30 Python
Python实现的最近最少使用算法
2015/07/10 Python
PyQt5 QSerialPort子线程操作的实现
2018/04/21 Python
详谈Python3 操作系统与路径 模块(os / os.path / pathlib)
2018/04/26 Python
mvc框架打造笔记之wsgi协议的优缺点以及接口实现
2018/08/01 Python
OpenCV2从摄像头获取帧并写入视频文件的方法
2018/08/03 Python
对python pandas 画移动平均线的方法详解
2018/11/28 Python
使用Python和Scribus创建一个RGB立方体的方法
2019/07/17 Python
Python Django 封装分页成通用的模块详解
2019/08/21 Python
python实现密度聚类(模板代码+sklearn代码)
2020/04/27 Python
python接口自动化之ConfigParser配置文件的使用详解
2020/08/03 Python
西班牙拥有最佳品牌的动物商店:Animalear.com
2018/01/05 全球购物
服装厂厂长职责
2013/12/16 职场文书
党员教师自我剖析材料
2014/09/29 职场文书
消防验收申请报告
2015/05/15 职场文书