修改 HTML 元素

修改 HTML DOM 意味着许多不同的方面：

  • 改变 HTML 内容
  • 改变 CSS 样式
  • 改变 HTML 属性
  • 创建新的 HTML 元素
  • 删除已有的 HTML 元素
  • 改变事件（处理程序）

在接下来的章节，我们会深入学习修改 HTML DOM 的常用方法。

建 HTML 内容

改变元素内容的最简答的方法是使用 innerHTML 属性。

下面的例子改变一个 <p> 元素的 HTML 内容：

<!DOCTYPE html>

<html>

<body>

<p id="p1">Hello World!</p>

<script>

document.getElementById("p1").innerHTML="New text!";

</script>

<p>上面的段落被一段脚本改变了。</p>

</body>

</html>

改变 HTML 样式

通过 HTML DOM，您能够访问 HTML 元素的样式对象。

下面的例子改变一个段落的 HTML 样式：

<html>

<body>

<p id="p2">Hello world!</p>

<script>

document.getElementById("p2").style.color="blue";

</script>

</body>

</html>

创建新的 HTML 元素

如需向 HTML DOM 添加新元素，您首先必须创建该元素（元素节点），然后把它追加到已有的元素上。

<div id="d1">

<p id="p1">This is a paragraph.</p>

<p id="p2">This is another paragraph.</p>

</div>

<script>

var para=document.createElement("p");

var node=document.createTextNode("This is new.");

para.appendChild(node);

var element=document.getElementById("d1");

element.appendChild(para);

</script>

HTML DOM 创建与修改的更多相关文章

  1. JavaEE XML DOM创建

    DOM创建XML @author ixenos 1.思路: 先封装构建一颗DOM树,然后将DOM树转换成XML文件 2.三种写DOM树到XML文件的方式: 1)使用DOM(或DOM4J.JDOM) 2 ...

  2. Oracle触发器原理、创建、修改、删除

    本篇主要内容如下: 8.1 触发器类型 8.1.1 DML触发器 8.1.2 替代触发器 8.1.3 系统触发器 8.2 创建触发器 8.2.1 触发器触发次序 8.2.2 创建DML触发器 8.2. ...

  3. <<< Oracle序列的创建、修改、删除基本操作

    序列是一个命名的顺序编号生成器,可以被多个用户共享,类似sqlserver中的identity create sequence 序列名; //直接创建一个序列 CREATE SEQUENCE 序列名; ...

  4. ABAP 生产订单的创建与修改函数

    ABAP 生产订单的创建与修改函数转自http://www.cnblogs.com/aBaoRong/archive/2012/04/11/2441946.html   如果生产订单过多,可以批量创建 ...

  5. 用 C# 轻松读取、改变文件的创建、修改、访问时间

    创建时间是文件存入到电脑中的时间,而修改时间则是改变起内容的最后时间 // 读取文件的创建.修改.访问时间FileInfo fi = new FileInfo("C://test.txt&q ...

  6. oracle 11g 如何创建、修改、删除list-list组合分区

    Oracle11g在分区方面做了很大的提高,不但新增了4种复合分区类型,还增加了虚拟列分区.系统分区.INTERVAL分区等功能. 9i开始,Oracle就包括了2种复合分区,RANGE-HASH和R ...

  7. (转) mysql的连接,创建账号,修改密码

    原文:http://blog.chinaunix.net/uid-20749043-id-1878306.html  mysql的连接,创建账号,修改密码 2008-10-13 15:31:29 分类 ...

  8. MySQL：创建、修改和删除表

    其实对很多人来说对于SQL语句已经忘了很多,或者说是不懂很多,因为有数据库图形操作软件,方便了大家,但是我们不能忘记最根本的东西,特别是一些细节上的东西,可能你用惯了Hibernate,不用写SQL语 ...

  9. SQLite 入门教程（二）创建、修改、删除表 （转）

    转于 SQLite 入门教程(二)创建.修改.删除表 一.数据库定义语言 DDL 在关系型数据库中,数据库中的表 Table.视图 View.索引 Index.关系 Relationship 和触发器 ...

随机推荐

  1. Nginx 拒绝指定IP访问

    来源 : http://www.ttlsa.com/nginx/nginx-deny-ip-access/   闲来无事,登陆服务器,发现有个IP不断的猜测路径.试图往服务器上传文件(木马).于是查看 ...

  2. 在Windows的CMD中如何设置支持UTF8编码

    这个问题很多人开始都会不知道,当然包括曾经的我,当用到的时候,只好求助于伟大的股沟和度娘了.网上有设置的方法,但说明确不够详细系统,说设置字体为:Lucida Console.问题是,在默认方式下,只 ...

  3. 【Howie玩docker】-windows下玩docker

    Windows下安装toolbox一直没成功,于是投机取巧,用虚拟机手工打造玩docker的方法. 步骤: 安装虚拟机,安装centos 在win下建立共享文件夹,假如是 f:/share 在cent ...

  4. the C programming language 阅读笔记2

    1. 指针 1.1 自增符的使用 ++*p;//p指向的内容加一 (*p)++; //p指向的内容加一 *p++;//p本身自增 *++p; //p本身自增 因为诸如*和++这样的一元运算符在表达式求 ...

  5. windbg命令学习3

    3.进程与线程: 既可以显示进程和线程列表,又可以显示指定进程或线程的详细信息.调试命令可以提供比taskmgr更详尽的进程资料,在调试过程中不可或缺. 3.1. 进程命令 进程命令包括以下:显示进程 ...

  6. C语言入门（13）——循环

    在递归调用中,其实每次递归都是在重复做同样一件事,比如求阶乘就是把n乘到(n-1)!上然后把结果返回.虽说是重复,但每次做都稍微有一点区别(n的值不一样),这种每次都有点区别的重复工作称为迭代. 我们 ...

  7. collection系列用法-defaultdict()

    defaultdict() 定义以及作用 返回一个和dictionary类似的对象,和dict不同主要体现在2个方面: 可以指定key对应的value的类型. 不必为默认值担心,换句话说就是不必担心有 ...

  8. 10要点解决IE6兼容性问题

    1.使用声明 你必须经常在html网页头部放置一个声明,推荐使用严格的标准.例如 <!DOCTYPEHTMLPUBLIC“-//W3C//DTDHTML4.01//EN”   "htt ...

  9. Unity3D游戏开发从零单排(五) - 导入CS模型到Unity3D

    游戏动画基础 Animation组件 Animation组件是对于老的动画系统来说的. 老的动画形同相应的动画就是clip,每一个运动都是一段单独的动画,使用Play()或CrossFade(),直接 ...

  10. html5 绘制集合图形

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...