<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <h1>helloworld</h1>

        <script type="text/javascript">

            var h1 = document.querySelector('h1')

            //一般使用innerHTML,可以将HTML的字符串直接放置进来，那么浏览器会自动生成相对应的文档对象和显示内容

            h1.innerHTML = "<span style='font-size: 12px; color: #aaa;'>samalltitle</span>BigTitle"

//            h1.innerText = '<span>helloworld</span>'

            var span = document.querySelector('span')

            console.log(span)

            span.innerHTML = 'helloworld'

//            document.write('<h3>helloworld</h3>')

            //创建元素

            var h3 = document.createElement('h3')

            h3.innerHTML = '这是H3'

            //获取想要添加进去的父级元素

            var body = document.body

            //使用appendchild,追加子元素，将h3添加进body

            body.appendChild(h3)

//            body.removeChild(h3)

            //仅仅通过自己就可以删除自己

            h3.parentElement.removeChild(h3)

        </script>

    </body>

</html>

Dom对象更改文档结构.html的更多相关文章

  1. 精讲 org.w3c.dom(java dom)解析XML文档

    org.w3c.dom(java dom)解析XML文档 位于org.w3c.dom操作XML会比较简单,就是将XML看做是一颗树,DOM就是对这颗树的一个数据结构的描述,但对大型XML文件效果可能会 ...

  2. Win 10 开发中Adaptive磁贴模板的XML文档结构，Win10 应用开发中自适应Toast通知的XML文档结构

    分享两篇Win 10应用开发的XML文档结构:Win 10 开发中Adaptive磁贴模板的XML文档结构,Win10 应用开发中自适应Toast通知的XML文档结构. Win 10 开发中Adapt ...

  3. MongoDB学习笔记(四) 用MongoDB的文档结构描述数据关系

    MongoDB的集合(collection)可以看做关系型数据库的表,文档对象(document)可以看做关系型数据库的一条记录.但两者并不完全对等.表的结构是固定的,MongoDB集合并没有这个约束 ...

  4. PHP中利用DOM创建xml文档

    DOM创建xml文档 用dom创建如下文档: <booklist> <book id="1"> <title>天龙八部</title> ...

  5. 4. svg学习笔记-文档结构元素和样式的使用

    svg除了绘图元素之外还有一部分是专门用于文档结构的,这类元素有<g>,<use>,<defs>,<symbol>等 <g>元素 如果我们仅 ...

  6. 10LaTeX学习系列之---Latex的文档结构

    目录 目录 前言 (一)对于Ctex宏包中的文档结构 1.说明 2.源代码 3.输出效果 4.技巧 (二)对于ctexart的文档结构 1.说明 2.源代码 3.输出效果 (三)对于ctexbook的 ...

  7. CSS设计指南之一 HTML标记与文档结构

    HTML标记与文档结构 之所以从HTML讲起,是因为CSS的用途就是为HTML标记添加样式. 1.1 HTML标记基础 对于每个包含内容的元素,根据它所包含的内容是不是文本,有两种不同的方式给它们加标 ...

  8. 使用DOM解析XML文档

    简单介绍一下使用DOM解析XML文档,解析XML文件案例: <?xml version="1.0" encoding="UTF-8"?> -< ...

  9. python beautifulsoup基本用法-文档结构

    一.BeautifulSoup概述 BeautifulSoup是python的一个库,用于接收一个HTML或XML字符串并对其进行格式化,然后使用提供的方法快速查找指定元素. 使用BeautifulS ...

随机推荐

  1. 手把手教你Pytest+Allure2.X定制报告详细教程，给自己的项目量身打造一套测试报告-02（非常详细，非常实用）

    简介 前边一篇文章是分享如何搭建pytest+Allure的环境,从而生成一份精美的.让人耳目一新的测试报告,但是有的小伙伴或者童鞋们可能会问,我能不能按照自己的想法为我的项目测试结果量身打造一份属于 ...

  2. linux中将video转换成gif

    我使用的机器是Linux mint 17,因为习惯了在linux中开发而有时候在写小demo的时候要带一些演示,虽然可以使用录屏也可以但是视屏演示这些小demo也不是特别的方便.之前一直在linux中 ...

  3. 深入集合类系列——HashMap和HashTable的区别

    含义:HashMap是基于哈希表的Map接口的非同步实现.允许使用null值和null键.此类不保证映射的顺序,特别是它不保证该顺序恒久不变. 数据结构:HashMap实际上是一个“链表散列”的数据结 ...

  4. centos 下安装 Let’s Encrypt 永久免费 SSL 证书

    功能 https证书,免费版,每三个月续签一次,可以用过脚本自动续签 安装 ssh登录到域名配置所在的主机(nginx,apache等) 安装git yum -y install git 输入 git ...

  5. 06-border

    边框 border:边框,描述盒子的边框 边框的三要素:粗细 线性样式 颜色 例如:border:1px solid red: 如果颜色不写,默认是黑色:如果粗细不写,不显示边框:如果只写线性样式,默 ...

  6. redis服务打不开--解决办法

    D:\>redis-server[11896] 04 Dec 19:20:05.122 # Warning: no config file specified, using the defaul ...

  7. MongoDB 学习笔记之 $push,$each,$slice组合使用

    $push使用: 使用$push给数组添加2个新成员 db.ArrayTest.updateOne({ "name" : "Bill"},{$push: {&q ...

  8. gorilla/mux类库解析

    golang自带的http.SeverMux路由实现简单,本质是一个map[string]Handler,是请求路径与该路径对应的处理函数的映射关系.实现简单功能也比较单一: 不支持正则路由, 这个是 ...

  9. springboot+thymeleaf国际化方法一：LocaleResolver

    springboot中大部分有默认配置所以开发起项目来非常迅速,仅对需求项做单独配置覆盖即可 spring采用的默认区域解析器是AcceptHeaderLocaleResolver,根据request ...

  10. 【TencentOS tiny】深度源码分析（8）——软件定时器

    软件定时器的基本概念 TencentOS tiny 的软件定时器是由操作系统提供的一类系统接口,它构建在硬件定时器基础之上,使系统能够提供不受硬件定时器资源限制的定时器服务,本质上软件定时器的使用相当 ...