<!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. selenium介绍及环境安装

      selenium简介: seelenium是web应用程序自动化工具,通过自动操作浏览器,进行点击.输入.回车.返回等来模拟用户的真实行为.如何理解和看待selenium项目,selenium官方 ...

  2. js中的计时器事件`setTimeout()` 和 `setInterval()`

    js中的计时器事件 在js中,通常会有一些事件,我们需要让它 间隔一段时间之后再发生,或者 每隔一段时间 发生一次,那就需要用到我们js中的计时事件 计时事件主要有两种: setTimeout() - ...

  3. Maven 梳理 -eclipse中创建Maven的web项目

    已验证成功: 1.创建Maven的Web工程 新建Maven工程:File -> New -> Maven Project,具体如下所示: 点击Next进入下述页面,下方的窗口是我们选择所 ...

  4. 获取Android设备标识符

    Android开发中有时候因业务需要客户端要产生一个唯一的标识符使服务器能识别某台Android设备,目前一般使用三种标识符分别为DeviceId.AndroidId.MAC地址. 获取DeviceI ...

  5. 如何制作一个Nginx镜像

    1,从这里你将学到编写Dockerfile的4个重要指令RUN,EXPOSE,ADD,ENTRYPOINT2,在Dockerfile中编写拷贝文件至容器的方法3, 安装一个nginx server,并 ...

  6. mysql 变量赋值的三种方法

    mysql中变量不用事前申明,在用的时候直接用“@变量名”使用就可以了.第一种用法:set @num=1; 或set @num:=1; //这里要使用变量来保存数据,直接使用@num变量第二种用法:s ...

  7. Solidity 编程实例--简单的公开拍卖

    通常简单的公开拍卖合约,是每个人可以在拍卖期间发送他们的竞拍出价.为了实现绑定竞拍人的到他们的拍卖,竞拍包括发送金额/ether.如果产生了新的最高竞拍价,前一个最高价竞拍人将会拿回他的钱.在竞拍阶段 ...

  8. CentOS 8 网卡设置

    本次测试环境是在虚拟机上测试 网卡配置文件路径:/etc/sysconfig/network-scripts/ifcfg-ens33 [root@localhost ~]# cd /etc/sysco ...

  9. 记一次共享内存/dev/shm 小于memory_target 引发的客户DB 宕机问题

    1> 记一次共享内存/dev/shm 小于memory_target 引发的客户DB 宕机问题(处理心得)

  10. 将jar包发布到maven的中央仓库细节整理

    在学习springboot框架的时候,会引入各种各样的starter依赖,照着教程尝试写了个demo-spring-boot-stater,可以理解为一个组件,随引随用 但是只能自己引用,无法共享,于 ...