<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

</head>

<body>

<div><b id="oldnode">JavaScript</b>是一个很常用的技术，为网页添加动态效果。</div>

<a href="javascript: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>

javaScript替换元素节点的更多相关文章

  1. 替换元素节点replaceChild()

    替换元素节点replaceChild() replaceChild 实现子节点(对象)的替换.返回被替换对象的引用. 语法: node.replaceChild (newnode,oldnew ) 参 ...

  2. replaceWith() 和 replaceAll() 方法替换元素节点

    $("#Span1").replaceWith("<span title='replaceWith'>陶国荣</span>"); $(& ...

  3. javascript删除元素节点

    1.删除元素父节点 function removeElement(_element){ var _parentElement = _element.parentNode; if(_parentElem ...

  4. [TimLinux] JavaScript 获取元素节点的5种方法

    1. getElementById document.getElementById("id_value") # 返回值为Node对象,没有元素时,返回 == undefined值( ...

  5. Javascript进阶篇——(DOM—节点---插入、删除和替换元素、创建元素、创建文本节点)—笔记整理

    插入节点appendChild()在指定节点的最后一个子节点列表之后添加一个新的子节点.语法: appendChild(newnode) //参数: //newnode:指定追加的节点. 为ul添加一 ...

  6. JavaScript之怎样获取元素节点

    JavaScript获取元素节点一共有三种方法,分别是通过元素ID.通过标签名字和通过类名字来获取: 1.通过元素ID属性的ID值来获得元素对象-getElementById() DOM提供了一个名为 ...

  7. JavaScript的DOM编程--04--获取元素节点的子节点

    获取元素节点的子节点(**只有元素节点才有子节点!!) 1). childNodes 属性获取全部的子节点, 但该方法不实用. 因为如果要获取指定的节点 的指定子节点的集合, 可以直接调用元素节点的 ...

  8. 获取元素节点的子节点 & 获取文本节点

    1. 获取元素节点的子节点(**只有元素节点才有子节点):              ①. childNodes 属性获取全部的子节点, 但该方法不实用. 因为如果要获取指定的节点          ...

  9. 使用JavaScript操作DOM节点元素的常用方法(创建/删除/替换/复制等)

    getElementById(id)这是通过id来访问某一元素,最常用的之一,例:<html><body><div id="myid">test ...

随机推荐

  1. FastStone Capture的使用

    FastStone Capture的使用 FastStone Capture是一款精简而优秀的图像处理软件,在工作中会经常用到.我在本地安装了FastStone Capture 8.4版本 (提取码: ...

  2. Linux下配置SNAT上网

    局域网有一台主机A,没有公网的IP, 也就是没有办法直接连到互联网上下载东西,同时内网有另外一台主机B,有公网接入.这个时候为了让A连接到互联网,我把B设置成NAT主机,A的网关指向B.准确的来说,现 ...

  3. 撸一撸Spring Cloud Ribbon的原理-负载均衡器

    在上一篇<撸一撸Spring Cloud Ribbon的原理>中整理发现,RestTemplate内部调用负载均衡拦截器,拦截器内最终是调用了负载均衡器来选择服务实例. 接下来撸一撸负载均 ...

  4. 获取对象属性类型、属性名称、属性值的研究：反射和JEXL解析引擎

    同步发布:http://www.yuanrengu.com/index.php/20170511.html 先简单介绍下反射的概念:java反射机制是在运行状态中,对于任意一个类,都能够知道这个类的所 ...

  5. ubuntu16.04编译安装mysql-boost-5.7.21并编译成php扩展测试与使用

    我之前的文章已经改造了自定义MVC框架中的工具类(验证码,图片上传,图像处理,分类)4个类,接下来,就要改造模型类,模型类肯定要连接数据库,由于我的Ubuntu Linux是裸装的php(目前只编译了 ...

  6. linux开放80 端口

    1.使用su登录管理员用户 2.编辑防火墙配置文件 vim /etc/sysconfig/iptables 3.在里面加入后保存 #open port 80 -A INPUT -p TCP -m st ...

  7. try{}里有一个 return 语句，那么紧跟在这个 try 后的 finally {}里的 code 会 不会被执行，什么时候被执行，在 return 前还是后?

    这是一道面试题,首先finally{}里面的code肯定是会执行的,至于在return前还是后, 看答案说的是在return后执行,我觉得不对,百度了一下,有说return前的,有说return后的, ...

  8. 老男孩Python全栈开发（92天全）视频教程 自学笔记07

    day7课程内容: Python的编码解码 二进制 --->ASCII:只能存英文和拉丁字符,一个字符占一个字节,8位 ------->gb2312:只能6700多个中文,1980年 -- ...

  9. qt 如何安装 Debuggers 调试器 ？

    1.下载 SDK 或 WDK 打开网址:https://developer.microsoft.com/zh-cn/windows/hardware/windows-driver-kit 选择 SDK ...

  10. Redis笔记1-redis的搭建和使用

    1.   Redis的安装 1.1. Redis的安装 Redis是c语言开发的. 安装redis需要c语言的编译环境.如果没有gcc需要在线安装.yum install gcc-c++ 安装步骤: ...