在JS中用什么方法替换页面元素,代码如何写
Admin 2022-07-14 群英技术资讯 775 次浏览
这篇文章给大家分享的是“在JS中用什么方法替换页面元素,代码如何写”,对大家学习和理解有一定的参考价值和帮助,有这方面学习需要的朋友,接下来就跟随小编一起学习一下吧。在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进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
这篇文章主要为大家介绍了js前端获取用户位置及ip属地信息示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
在全局作用域中使用var操作符声明的变量将成为window对象的属性。使用var操作符定义的变量将成为包含其函数的局部变量。在函数中定义变量时省略var操作符,创建全局变量。
今天给大家分享的是关于基于jQuery封装的拖拽事件,下文有详细的代码及注释,对大家学习和理解封装以及拖拽事件都有一定的帮助,有需要的朋友可以参考。
JS定时器如何实现提交成功提示功能, 应用场景:<br /> 用户评论后,在合适位置弹出“评论成功”,2秒钟后自动消失,提示用户评论成功。<br /> HTML:<br /> <br /> <br /> {#评论成功提示#}<br /> <div class="popup_con" style="display
本文给大家分享用纯JavaScript+CSS怎样做页面滚动的动画的内容,让元素根据滚动位置实现动画效果比较流行,除了本文的方法也可以用第第三方插件或库来实现,废话不多说,下面直接看代码。
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008