<!DOCTYPE HTML>
<html>

<head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>js清除节点内容||改变标签元素</title>
    </head>

<body>
        <!--清除节点内容-->
        <div id="content">
            <h1>html</h1>
            <h1>php</h1>
            <h1>javascript</h1>
            <h1>jquery</h1>
            <h1>java</h1>
        </div>
        <button onclick="clearText()">清除节点内容</button>
        <!--改变标签元素-->

<div>
            <b id="oldnode">JavaScript</b> 是一个很常用的技术,为网页添加动态效果。
        </div>
        <a href="javascript:replaceMessage()"> 将加粗改为斜体</a>
    </body>
    <script type="text/javascript">
        //     清除节点元素
        function clearText() {
            var content = document.getElementById("content");
            // 在此完成该函数
            var x = content.removeChild(content.childNodes[1]);

}
        //     改变标签元素
        function replaceMessage() {
            var oldnode = document.getElementById("oldnode");
            var newnode = document.createElement("i");
            newnode.innerHTML = oldnode.innerHTML;
            oldnode.parentNode.replaceChild(newnode, oldnode);

}
    </script>

</html>

js清除节点内容(改变标签元素)的更多相关文章

  1. JS清除选择内容的方法

    本文实例讲述了JS清除选择内容的方法.分享给大家供大家参考.具体分析如下: 今天在做一个DIV拖动的效果,发现在拖动的时候会选中页面中的文本,于是找了一下JS清除选择的内容的相关信息. 在得到的结果中 ...

  2. JS DOM节点(当前标签和同级、父级、子级..之间的关系)

    1. 通过顶层document节点获取    1) document.getElementById(elementId) //根据id获得    2) document.getElementsByNa ...

  3. JS 清除字符串数组中,重复元素

    <script language="JavaScript"> <!-- var arrData=new Array(); for(var i=0; i<10 ...

  4. JS 清除DOM 中空白元素节点

    HTML中的空白节点会影响整体的HTML的版面排榜 例如: 制作百度首页时,两个input之间的空白节点将本来是要整合在一起的搜索栏硬是把按钮和搜索框分离出现好丑的间隙 这时我们就可以用js清除这个空 ...

  5. js改变HTML元素的值

    js改变HTML元素的值(常用,备忘) <!DOCTYPE html> <html> <body> <h1>我的第一段 JavaScript</h ...

  6. JS获取节点的兄弟,父级,子级元素的方法(js获取子级获取到换行与空格元素-FF)

    先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作对比. JS的方法会比JQUERY麻烦很多,主要则是因为FF浏览器,FF浏览器会把你的换行也当最DOM元素 < ...

  7. 通过JS动态的修改HTML元素的样式和增添标签元素等

    一. 通过JS动态的修改HTML元素的样式   1. 要想在js中动态的修改HTML元素的样式,首先需要写document,    document我们称之为文档对象,这个对象中保存了当前网页中所有的 ...

  8. 【onclick事件】【改变 HTML 内容innerHTML】【图片替换】【改变标签的css】【判断输入是否是数字】

    1.onclick事件 <button type="button" onclick="alert('Welcome!')">点击这里</but ...

  9. JS获取节点的兄弟,父级,子级元素

    https://blog.csdn.net/duanshuyong/article/details/7562423 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作 ...

随机推荐

  1. typedef说明

    typedef 只对已有的类型进行别名定义,不产生新的类型: #define 只是在预处理过程对代码进行简单的替换. 类比理解: typedef  unsigned int  UINT32;  // ...

  2. Java通信——获取自己IP

    获取自己的IP地址 import java.net.InetAddress; import java.net.UnknownHostException; public class getip { pu ...

  3. wampserver 运行橙色,80端口没有被占用,查看错误日志方法

    wampserver运行时橙色,经检查80端口并没有被占用,试了很多种方法都无效,去查看错误日志吧 1.以管理员身份打开CMD 注意这里必须是管理员身份的CMD ,powershell不行的 进入wa ...

  4. Spring Security 入门 (二)

    我们在篇(一)中已经谈到了默认的登录页面以及默认的登录账号和密码. 在这一篇中我们将自己定义登录页面及账号密码. 我们先从简单的开始吧:设置自定义的账号和密码(并非从数据库读取),虽然意义不大. 上一 ...

  5. Oracle数据库提权(低权限提升至dba)

    0x01 Oracle存储过程”缺陷” 在 Oracle 的存储过程中,有一个有趣的特点:运行权限.运行权限分为两种,definer 和 invoker. definer 为函数创建者的权限,而 in ...

  6. 一张图看懂Rxjava的原理

    前言 Rxjava是NetFlix出品的Java框架, 官方描述为 a library for composing asynchronous and event-based programs usin ...

  7. opencv实践::直线检测

    问题描述 寻找英语试卷填空题的下划线,这个对后期的切图与自动 识别都比较重要. 解决思路 方法: 通过图像形态学操作来寻找直线,霍夫获取位置信息与显示. #include <opencv2/op ...

  8. go-异常处理-error-panic-recover

    Go语言的函数可以一次返回多个结果.这就为我们温和地报告错误提供了语言级别的支持. func readFile(path string) ([]byte, error) { file, err := ...

  9. 在Python中,输出格式:%d , %6d , %-6d, %06d , %.6f的一些区分

    和C/C++编程语言一样 %d 普通的整数输出 i = 1 sum = 0 while i <= 100: sum += i i += 1 print("1到100的和为:%d&quo ...

  10. HTTP使用get,post方式连接

    在项目中使用了http的get和post方式连接,发送传输数据: public static String doGet(String httpUrl) { HttpURLConnection conn ...