动态的创建一个元素createElement及删除一个元素


Posted in Javascript onJanuary 24, 2014
<html> 
<script language = "javascript" type = "text/javascript"> 
function test(){ 
//创建元素 
var myElement = document.createElement("a");//a是想创建的html元素标签名 
//给创建的元素添加必要的信息 
myElement.href = "http://www.baidu.com"; 
myElement.innerText = "连接到百度"; 
myElement.id = "id1"; 
//myElement.style.top = "300px"; 
//myElement.style.left = "500px"; 
//myElement.style.position = "absolute"; 
//把创建的元素添加到body 对象上 
//document.body.appendChild(myElement); 
//将元素添加到div 
document.getElementById("div1").appendChild(myElement); 
} 
function test2(){ 
//删除一个元素 
//也可以通过属性获得新增元素的父元素 
//document.getElementById("id1").parentNode 
document.getElementById("div1").removeChild(document.getElementById("id1")); 
} 
</script> 
<body> 
<input type = "button" onclick = "test()" value = "动态的创建一个超链接"/> 
<input type = "button" onclick = "test2()" value = "动态的删除添加的元素"/> 
<div id = "div1" style = "width:200px;height:300px;border:1px solid red"> 
div1 
</div> 
</body> 
</html>

动态的创建一个元素createElement及删除一个元素
Javascript 相关文章推荐
JavaScript 创建对象和构造类实现代码
Jul 30 Javascript
jquery插件制作 图片走廊 gallery
Aug 17 Javascript
node.js Web应用框架Express入门指南
May 28 Javascript
jquery取子节点及当前节点属性值的方法
Sep 09 Javascript
node.js中的fs.realpath方法使用说明
Dec 16 Javascript
jQuery中innerHeight()方法用法实例
Jan 19 Javascript
使用jQuery制作遮罩层弹出效果的极简实例分享
May 12 Javascript
node.js基于fs模块对系统文件及目录进行读写操作的方法详解
Nov 10 Javascript
浅谈Vue下使用百度地图的简易方法
Mar 23 Javascript
js中数组对象去重的两种方法
Jan 18 Javascript
在vue项目中使用Jquery-contextmenu插件的步骤讲解
Jan 27 jQuery
Vue实现开关按钮拖拽效果
Sep 22 Javascript
动态的绑定事件addEventListener方法的使用
Jan 24 #Javascript
js监听滚动条滚动事件使得某个标签内容始终位于同一位置
Jan 24 #Javascript
js利用事件的阻止冒泡实现点击空白模态框的隐藏
Jan 24 #Javascript
JS实现点击链接取消跳转效果的方法
Jan 24 #Javascript
js关于字符长度限制的问题示例探讨
Jan 24 #Javascript
JS方法调用括号的问题探讨
Jan 24 #Javascript
Array栈方法和队列方法的特点说明
Jan 24 #Javascript
You might like
E路文章系统PHP
2006/12/11 PHP
IIS下PHP连接数据库提示mysql undefined function mysql_connect()
2010/06/04 PHP
微信公众平台之快递查询功能用法实例
2015/04/14 PHP
php实现粘贴截图并完成上传功能
2015/05/17 PHP
php版微信公众号接口实现发红包的方法
2016/10/14 PHP
Yii框架弹出框功能示例
2017/01/07 PHP
javascript 随机展示头像实现代码
2011/12/06 Javascript
30分钟就入门的正则表达式基础教程
2013/02/25 Javascript
jQuery图片滚动图片的效果(另类实现)
2013/06/02 Javascript
javascript避免数字计算精度误差的方法详解
2014/03/05 Javascript
JavaScript中获取样式的原生方法小结
2014/10/08 Javascript
Jqgrid之强大的表格插件应用
2015/12/02 Javascript
JavaScript中setter和getter方法介绍
2016/07/11 Javascript
canvas雪花效果核心代码分享
2017/02/19 Javascript
websocket+node.js实现实时聊天系统问题咨询
2017/05/17 Javascript
vue 关闭浏览器窗口的时候,清空localStorage的数据示例
2019/11/06 Javascript
[03:11]2014DOTA2国际邀请赛-VG掉入败者组 独家专访357
2014/07/19 DOTA
[46:47]完美世界DOTA2联赛PWL S2 FTD vs Magma 第二场 11.20
2020/11/23 DOTA
python中使用百度音乐搜索的api下载指定歌曲的lrc歌词
2014/07/18 Python
python的paramiko模块实现远程控制和传输示例
2017/10/13 Python
Python Threading 线程/互斥锁/死锁/GIL锁
2019/07/21 Python
Python高阶函数、常用内置函数用法实例分析
2019/12/26 Python
python如何编写win程序
2020/06/08 Python
CSS3 3D位移translate效果实例介绍
2016/05/03 HTML / CSS
Skip Hop官网:好莱坞宝宝挚爱品牌
2018/06/17 全球购物
旅游与酒店管理的自我评价分享
2013/11/03 职场文书
事务机电主管工作职责
2014/02/25 职场文书
文明城市标语
2014/06/16 职场文书
学校党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
小学校园广播稿集锦
2014/10/04 职场文书
2014年财政局工作总结
2014/12/09 职场文书
2015年社区文体活动总结
2015/03/25 职场文书
党员承诺书格式范文
2015/04/28 职场文书
乡镇法制宣传日活动总结
2015/05/05 职场文书
请客吃饭开场白
2015/06/01 职场文书
Python+DeOldify实现老照片上色功能
2022/06/21 Python