动态的创建一个元素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效率调优经验
Jun 04 Javascript
JQuery获取文本框中字符长度的代码
Sep 29 Javascript
javascript检测页面是否缩放的小例子
May 16 Javascript
jQuery实现点击图片翻页展示效果的方法
Feb 16 Javascript
JavaScript实现显示函数调用堆栈的方法
Apr 21 Javascript
Jquery和JS获取ul中li标签的实现方法
Jun 02 Javascript
JavaScript编码风格指南(中文版)
Aug 26 Javascript
jQuery实现带延时功能的水平多级菜单效果【附demo源码下载】
Sep 21 Javascript
微信小程序 radio单选框组件详解及实例代码
Jan 10 Javascript
JavaScript使用FileReader实现图片上传预览效果
Mar 27 Javascript
Vue中的slot使用插槽分发内容的方法
Mar 01 Javascript
详解webpack的proxyTable无效的解决方案
Jun 15 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
《Re:从零开始的异世界生活 冰结之绊》
2020/04/09 日漫
解决了Ajax、MySQL 和 Zend Framework 的乱码问题
2009/03/03 PHP
给ECShop添加最新评论
2015/01/07 PHP
基于PHP-FPM进程池探秘
2017/10/17 PHP
PHP从零开始打造自己的MVC框架之入口文件实现方法详解
2019/06/03 PHP
jquery学习笔记二 实现可编辑的表格
2010/04/09 Javascript
一个报数游戏js版(约瑟夫环问题)
2010/08/05 Javascript
jquery创建并行对象或者合并对象的实现代码
2012/10/10 Javascript
jquery 删除cookie失效的解决方法
2013/11/12 Javascript
使用CSS3的scale实现网页整体缩放
2014/03/18 Javascript
JQuery中serialize() 序列化
2015/03/13 Javascript
js实现touch移动触屏滑动事件
2015/04/17 Javascript
JavaScript实现将文本框的值插入指定位置的方法
2015/08/13 Javascript
js数组如何添加json数据及js数组与json的区别
2015/10/27 Javascript
xcode中获取js文件的路径方法(推荐)
2016/11/05 Javascript
详解js中Number()、parseInt()和parseFloat()的区别
2016/12/20 Javascript
记一次vue跨域的解决
2020/10/21 Javascript
[01:33]DOTA2上海特级锦标赛 LIQUID战队完整宣传片
2016/03/16 DOTA
Python的“二维”字典 (two-dimension dictionary)定义与实现方法
2016/04/27 Python
python 实现网上商城,转账,存取款等功能的信用卡系统
2016/07/15 Python
python3 遍历删除特定后缀名文件的方法
2018/04/23 Python
Python Web编程之WSGI协议简介
2018/07/18 Python
Python多线程获取返回值代码实例
2020/02/17 Python
Python实现汇率转换操作
2020/05/03 Python
html5 button autofocus 属性介绍及应用
2013/01/04 HTML / CSS
html5给汉字加拼音加进度条的实现代码
2020/04/07 HTML / CSS
Notino瑞典:购买香水和美容产品
2019/07/26 全球购物
自我评价中英文语句
2013/11/30 职场文书
增员口号大全
2014/06/18 职场文书
寻找最美家庭活动方案
2014/08/20 职场文书
群众路线剖析材料(四风)
2014/11/05 职场文书
2015年社区纪检工作总结
2015/04/21 职场文书
2015年保卫科工作总结
2015/05/14 职场文书
Spring Boot 整合 Apache Dubbo的示例代码
2021/07/04 Java/Android
python异步的ASGI与Fast Api实现
2021/07/16 Python
MySQL数据库优化之通过索引解决SQL性能问题
2022/04/10 MySQL