在JS中用什么方法替换页面元素,代码如何写
Admin 2022-07-14 群英技术资讯 536 次浏览
在javascript中,可以利用replaceChild()方法来替换页面元素,该方法的作用就是用新节点替换某个子节点,语法“父节点.replaceChild(新节点,需要替换的老节点)”。
本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。
在javascript中,可以利用replaceChild()方法来替换页面元素。
replaceChild() 方法用新节点替换某个子节点。这个新节点可以是文档中某个已存在的节点,或者您也可创建新的节点。
语法:
node.replaceChild(newnode,oldnode)
参数 | 类型 | 描述 |
---|---|---|
newnode | Node object | 必需。您希望插入的节点对象。 |
oldnode | Node object | 必需。您希望删除的节点对象。 |
示例:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <div><b id="oldnode">JavaScript</b>是一个很常用的技术,为网页添加动态效果。</div><br /> <button onclick="replaceMessage()"> 将加粗改为斜体</a> <script type="text/javascript"> function replaceMessage() { var oldNode = document.getElementById("oldnode"); //提取老元素; var newNode = document.createElement("i"); //创建一个新的节点; newNode.innerHTML = oldNode.innerHTML; //把旧的oldnode内容赋值给新的newnode,要不然newnode是无内容,只是简单的改了个属性,把b变成了i,显示出来的是空; oldNode.parentNode.replaceChild(newNode, oldNode); //实现子节点(对象)的替换,返回被替换对象的引用; } </script> </body> </html>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
这篇文章主要介绍了uniapp和vue的区别,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
本文详细讲解了JS实现贪吃蛇小游戏的过程,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
这篇文章主要给大家分享require模块加载器的内容,一些朋友可能对require模块加载器不是很了解,使用下文我们就来详细的了解一下require模块加载器实现原理,那么接下来就跟随小编来学习一下吧。
main.js是我们的入口文件,主要作用是初始化vue实例,并引入所需要的插件,下面这篇文章主要给大家介绍了关于vue项目中main.js使用方法的相关资料,需要的朋友可以参考下
这篇文章主要为大家详细介绍了微信小程序下拉框组件使用方法,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008