原生js怎么删除一个 div

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>增加删除DIV的JS写法</title>
</head>
<body>
<div id="main">
<div id="box">111</div>
<div class="box2">222</div>
</div>
<script type="text/javascript">
var box = document.getElementById("box");
var main = document.getElementById("main");
var newMask = document.createElement("div");
newMask.id ="newMask";
main.appendChild(newMask);
if(box){
box.parentNode.removeChild(box);
}
else{
alert("没有这个div");
}
</script>
</body>
</html>

<div id="main">
<div id="box">111</div>
<div class="box2">222</div>
</div>
<script type="text/javascript">
var box = document.getElementById("box");
box.parentNode.removeChild(box);
</script>

时间： 2024-10-09 02:19:26

原生js怎么删除一个 div的相关文章

原生js写的一个弧形菜单插件

弧形菜单是一种半弧式或者全弧形菜单,是一种不同于传统横向或者竖向菜单形式的菜单.最近在网上看到好多人写出了这种效果,于是也尝试自己写了一个. 实现方式:原生态js 主要结构: 1.参数合并 1 var defaultPra = { 2 mainMenuId: "ArcMenu",//主菜单id 3 menuBoxId:"menuBox",//菜单包裹id 4 position: "",//弧形菜单 5 customPosition:"0

如何动态添加和删除一个div

代码实例如下: <!DOCTYPE html><html><head><meta charset="utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">#father{ wi

jQuery实现动态添加和删除一个div

本文主要给大家简单介绍一下如何动态的在一个元素添加和删除div,希望能够得到举一反三之效. 代码实例如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style type="text/css"> #father { width:150px; height:150px; background-color:red; } #father div {

原生js实现三个div层动态交换位置

html代码部分  <input type="button" onclick="startMove()" value="点击"/>  <div class="localbox"> <div id="b1" class="block1"></div> <div id

js删除一个div

参考 /** * @deprecated 关闭div 真正的从html中移除div代码,释放资源,兼容ie和火狐 * */var divobj = creatElement("div"); function closeDiv(divobj) { divobj.parentNode.removeChild(divobj); } 自己用传入div 名字 function delFile(obj) { var elem =

原生JS实现删除<li>标签一行内容

利用面向对象思想完成买家信息删除功能,每一条信息包含: 姓名(name) 性别(sex) 电话号码(number) 省份(province) 实现以下要求: 不能借用任何第三方库,需要使用原生代码实现. 结合给出的基本代码结构,在下方2处code here补充代码,完成买家信息的删除功能,注意此页面要在手机上清晰显示. js代码可以任意调整,例如和使用es6代码完成. <!DOCTYPE html> <html> <head> <meta charset=&quo

用原生JS实现的一个导航下拉菜单，下拉菜单的宽度与浏览器视口的宽度一样（js+html+css）

这个导航下拉菜单需要实现的功能是:下拉菜单的宽度与浏览器视口的宽度一样宽:一级导航只有两项,当鼠标移到一级导航上的导航项时,相应的二级导航出现.在本案例中通过改变二级导航的高度来实现二级导航的显示和消失.为了便于理解我画了一个图,如下: 在这个案例主要用到的知识有:设置定时器,清除定时器,mouseout和mouseover事件,另外还有css中position相关知识.本案例分为两部分讲解.第一部分html和css,第二部分js. 一. html和css 将导航这个导航条包裹在一个div中,这

原生JS写的一个书架式的图片缩放滚动展示特效代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <title>d

原生js实现删除class和添加class

内容来自百度搜索 //判断样式是否存在 function hasClass(ele, cls) { return ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)")); } //为指定的dom元素添加样式 function addClass(ele, cls) { if (!this.hasClass(ele, cls)) ele.className += " "