动态的创建一个元素createElement及删除一个元素
更新时间：2014年01月24日 15:22:19 作者：
本文用示例为大家介绍下动态创建一个元素createElement及删除一个元素，感兴趣的朋友可以参考下
复制代码 代码如下:
<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>
您可能感兴趣的文章:
- 浅谈javascript中createElement事件
- javascript createElement()创建input不能设置name属性的解决方法
- Javascript createElement和innerHTML增加页面元素的性能对比
- 动态添加option及createElement使用示例
- js 用CreateElement动态创建标签示例
- 使用jQuery解决IE与FireFox下createElement方法的差异
- document.createElement()用法
- createElement和onclick
- 动态加载js文件 document.createElement
- javascript中createElement的两种创建方式
相关文章
JavaScript style对象与CurrentStyle对象案例详解
这篇文章主要介绍了JavaScript style对象与CurrentStyle对象案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下2021-08-08
打印gridview对于一些童鞋们真的是很陌生啊,不过没有关系，因为本文的出现，或让你茅塞顿开，好了话不多说，感兴趣的朋友可以了解下，或许对你学习js高级知识有所帮助2013-02-02
在 ThreeJs 中,动画是创建动态 3D 场景的重要组成部分,本文将介绍如何使用 ThreeJs 实现基础的动画效果,需要的小伙伴可以参考一下2024-10-10
这篇文章主要介绍了JavaScript 拖拉时间之drag案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下2021-09-09
本文主要介绍了JavaScript获取标签的几种方式小结，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-02-02
这篇文章主要为大家详细介绍了微信小程序小组件，基于Canvas实现直播点赞气泡效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-02-02
实现NodeJS与Mysql的交互首先把Mysql Module装到NodeJS中，具体实现及结果截图如下，有此需求的朋友可以参考下，希望对大家有所帮助2013-08-08
因为我们的项目可以通过编写脚本（javascript）进行功能扩展，所以为了方便现场实施人员，所以突发奇想想在网页上（系统是B/S的）提供一个javascript的编辑器。2010-04-04
这篇文章主要介绍了基于JavaScript实现验证码功能的相关资料2017-04-04
在Web前端开发中，需要将数据动态渲染到页面上，随着应用程序的复杂度增加，数据渲染的逻辑也变得越来越复杂，这时候就需要使用模板引擎来帮助我们动态生成HTML标记，本文将深入介绍 JavaScript 模板引擎，帮助读者更好地理解和应用模板引擎2023-06-06
最新评论