javaScript(JS)替换节点实现思路介绍
2023-06-13 09:14:50 时间
<title></title>
<scripttype="text/javascript">
functioncreateNode(){
varpNode=document.createElement("p");
vartNode=document.createTextNode("烟花三月下杨州");
pNode.appendChild(tNode);
document.body.appendChild(pNode);
}
functionr(){
varpNode=document.createElement("p");
vartNode=document.createTextNode("故人西辞黄鹤楼");
pNode.appendChild(tNode);
//获取要替换的节点
varreNode=document.getElementsByTagName("p")[0];
//这种方法只适用于IE浏览器
//reNode.replaceNode(pNode,reNode);
//适用于各种浏览器
reNode.parentNode.replaceChild(pNode,reNode);
}
functionreNode(){
varoldNode=document.getElementsByTagName("p")[0];
//oldNode.parentNode返回的是p节点的父节点,这里就是body
//然后使用body节点的removeChild方法删除下的oldNode节点
oldNode.parentNode.removeChild(oldNode);
}
</script>
</head>
<body>
<inputid="Button1"type="button"value="创建节点"onclick="createNode()"/>
<inputid="Button2"type="button"value="替换节点"onclick="r()"/>
<inputid="Button3"type="button"value="删除节点"onclick="reNode()"/>
</body>
</html>
相关文章
- JS跳转代码_javascript跳转代码
- 经常会采坑的javascript原型应试题
- JavaScript——对象
- javascript动画效果_js动画效果animate
- JSON 之父:我们能为 JavaScript 所做最好的事就是让它退役
- js 怎么使用正则表达式-JavaScript正则表达式常用技巧
- JavaScript定时器
- AutoJs6 – v6.2.0 – 安卓 JavaScript 自动化工具 (Auto.js 二次开发)
- JavaScript日期处理不再难!Day.js带你飞!
- JavaScript探索之旅掌握Oracle和JS的完美融合(js与oracle)
- 用javascript实现页面无刷新更新数据
- ASP动态生成的javascript表单验证代码
- 计算黄金分割的javascript代码
- javascript表单日期选择效果
- 说说掌握JavaScript语言的思想前提想学习js的朋友可以看看
- isArray()函数(JavaScript中对象类型判断的几种方法)
- JavaScript常用函数
- JavaScript判断判断某个对象是Object还是一个Array
- js本身的局限性别让javascript做太多事
- JavaScript之appendChild、insertBefore和insertAfter使用说明
- JavaScript高级程序设计阅读笔记(十六)javascript检测浏览器和操作系统-detect.js
- JavaScript中__proto__与prototype的关系深入理解
- Javascript根据指定下标或对象删除数组元素
- JavaScript动态操作表格实例(添加,删除行,列及单元格)
- JavaScript中九种常用排序算法