Dom对象更改文档结构.html
<!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的更多相关文章
- 精讲 org.w3c.dom(java dom)解析XML文档
org.w3c.dom(java dom)解析XML文档 位于org.w3c.dom操作XML会比较简单,就是将XML看做是一颗树,DOM就是对这颗树的一个数据结构的描述,但对大型XML文件效果可能会 ...
- Win 10 开发中Adaptive磁贴模板的XML文档结构,Win10 应用开发中自适应Toast通知的XML文档结构
分享两篇Win 10应用开发的XML文档结构:Win 10 开发中Adaptive磁贴模板的XML文档结构,Win10 应用开发中自适应Toast通知的XML文档结构. Win 10 开发中Adapt ...
- MongoDB学习笔记(四) 用MongoDB的文档结构描述数据关系
MongoDB的集合(collection)可以看做关系型数据库的表,文档对象(document)可以看做关系型数据库的一条记录.但两者并不完全对等.表的结构是固定的,MongoDB集合并没有这个约束 ...
- PHP中利用DOM创建xml文档
DOM创建xml文档 用dom创建如下文档: <booklist> <book id="1"> <title>天龙八部</title> ...
- 4. svg学习笔记-文档结构元素和样式的使用
svg除了绘图元素之外还有一部分是专门用于文档结构的,这类元素有<g>,<use>,<defs>,<symbol>等 <g>元素 如果我们仅 ...
- 10LaTeX学习系列之---Latex的文档结构
目录 目录 前言 (一)对于Ctex宏包中的文档结构 1.说明 2.源代码 3.输出效果 4.技巧 (二)对于ctexart的文档结构 1.说明 2.源代码 3.输出效果 (三)对于ctexbook的 ...
- CSS设计指南之一 HTML标记与文档结构
HTML标记与文档结构 之所以从HTML讲起,是因为CSS的用途就是为HTML标记添加样式. 1.1 HTML标记基础 对于每个包含内容的元素,根据它所包含的内容是不是文本,有两种不同的方式给它们加标 ...
- 使用DOM解析XML文档
简单介绍一下使用DOM解析XML文档,解析XML文件案例: <?xml version="1.0" encoding="UTF-8"?> -< ...
- python beautifulsoup基本用法-文档结构
一.BeautifulSoup概述 BeautifulSoup是python的一个库,用于接收一个HTML或XML字符串并对其进行格式化,然后使用提供的方法快速查找指定元素. 使用BeautifulS ...
随机推荐
- java8 函数接口
[前言] java8新特性 java8 Optional使用总结 java8 lambda表达式 Java 8 时间日期使用 1.函数式接口新特性 java8中引入了函数式接口新特性,使用@Funct ...
- CentOS7 搭建php环境
1,先安装apache: yum install httpd 配置ServerName,进入httpd.conf文件: vi /etc/httpd/conf/httpd.conf 将#ServerNa ...
- windows下python和pycharm安装及其使用
1.python安装及环境变量配置 1.1 python安装 1.1.1 python下载 官网下载:https://www.python.org/ Downloads-Windows(Mac os ...
- 你的环境有问题吧?--byte数组转字符串的疑惑
1. 故事背景 小T是个测试MM,小C是个程序猿,今天早上他们又为一个bug吵架了. 小T:“这个显示是bug,在我的浏览器上显示不正确” 小C:“这个bug我不认,在我的电脑上显示正常,是你的环境有 ...
- yii2 rules 规则
required : 必须值验证属性 [['字段名'],required,'requiredValue'=>'必填值','message'=>'提示信息']; #说明:CRequiredV ...
- 【linux】Tomcat 安装
登录linux后,切换目录到 /usr/local cd /user/local 在/usr/local目录新建文件夹servers用于存放tomcat文件 mkdir servers 在文件夹ser ...
- spring-data-redis-cache 使用及源码走读
预期读者 准备使用 spring 的 data-redis-cache 的同学 了解 @CacheConfig,@Cacheable,@CachePut,@CacheEvict,@Caching 的使 ...
- ORM查询2
目录 十三式 2式(针对外键查询优化) select_related和prefetch_related prefetch_related 查询返回值类型 不等式查询 关键字查询 时间查询 跨表查询 组 ...
- 02-18 scikit-learn库之k近邻算法
目录 scikit-learn库之k近邻算法 一.KNeighborsClassifier 1.1 使用场景 1.2 代码 1.3 参数详解 1.4 方法 1.4.1 kneighbors([X, n ...
- 毕业设计过程中的一些学习Android网站
安卓巴士:http://www.apkbus.com/CSDN:(下载资源)http://www.csdn.net/?ref=toolbar博客园:http://www.cnblogs.com/极客学 ...