本人为小白,首次写博客  有不正确的地方望多多指点与见谅!!

一,改变HTML的内容

语法:

document.getElementById(id).innerHTML=new HTML;

具体用法:(1)

document.getElementById("p1").innnerHTML="你好";//把标签p1里的内容改为你好

具体用法:(2)

var XXX=document.getElementById("p2");
XXX.innerHTML="你好,世界";

二,改变HTML的属性

语法:

document.getElementById(id).attribute = new value;

例:

document.getElementById("p3").src="XXX.jpg";//将标签p3的图片换为XXX.jpg

三,更改HTML的样式

语法:

document.getElementById(id).style.prepetry = new style;

例:

document.getElementById("p4").style.color="red";//将标签P4的内容的字体改为红色
还可以添加进事件

<h1 id="p5">你好</h1>

<button type="button" onclick="document.getElementById('p5').style.color='red'">
点击这里
</button>

JavaScript HTML Dom改变HTML的更多相关文章

  1. JavaScript HTML DOM - 改变CSS

    JavaScript HTML DOM - 改变CSS HTML DOM 允许 JavaScript 改变 HTML 元素的样式. 改变 HTML 样式 如需改变 HTML 元素的样式,请使用这个语法 ...

  2. JavaScript HTML DOM - 改变 HTML

    JavaScript HTML DOM - 改变 HTML HTML DOM 允许 JavaScript 改变 HTML 元素的内容. 改变 HTML 输出流 JavaScript 能够创建动态的 H ...

  3. JavaScript HTML DOM - 改变 CSS

    HTML DOM 允许 JavaScript 改变 HTML 元素的样式. 改变 HTML 样式 如需改变 HTML 元素的样式,请使用这个语法: document.getElementById(id ...

  4. javascript HTML DOM 简单介绍

    JavaScript HTML DOM通过 HTML DOM,可访问 JavaScript HTML 文档的所有元素.HTML DOM (文档对象模型)当网页被加载时,浏览器会创建页面的文档对象模型( ...

  5. javascript --- javascript与DOM

    javascript与DOM: 我们来个例子,一个HTML里包含一段文本和一个无序的列表. <p id="intro">My first paragraph...< ...

  6. Javascript中DOM技术的的简单学习

    第十四课DOM技术概述1:DOM概述 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节 ...

  7. JavaScript与DOM的关系

    JavaScript与浏览器的工作 1.浏览器获取并加载你的页面,从上至下解析它的内容. 遇到JavaScript时,浏览器会解析代码,检查它的正确性,然后执行代码. 浏览器还会建立一个HTML页面的 ...

  8. JavaScript学习笔记(2)——JavaScript和DOM的关系

    文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口.DOM实际上是以面向对象方式描述的文档模型.DOM定义了表示和修改文档所需的 ...

  9. JavaScript HTML DOM 元素(节点)

    JavaScript HTML DOM 元素(节点) 创建新的 HTML 元素 创建新的 HTML 元素 如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一个已存在的元素 ...

随机推荐

  1. Java学习7——一些注意的地方

    (学习运算符.if和switch分支.for与while与do...while循环.break和continue.递归,内容和C++没差,挑了几个注意点) 运算符 逻辑与(&)和短路与(&am ...

  2. 201521123053《Java程序设计》第八周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 2. 书面作业 1.List中指定元素的删除(题目4-1) 1.1 实验总结 答:先贴上主要代码: priva ...

  3. 201521123051《java程序设计》 第五周学习总结

    1. 本周学习总结 1.1 尝试使用思维导图总结有关多态与接口的知识点. 使用工具:XMind 2. 书面作业 1.代码阅读:Child压缩包内源代码 1.1 com.parent包中Child.ja ...

  4. 201521123059 《Java程序设计》第二周学习总结

    1.本周总结 本周老师讲了和自己掌握了以下内容: (1).三元条件运算符 表达式1?表达式2:表达式3: (2). 字符串String类 String的不可变优点:编译器可以让字符串共享,效率高.但是 ...

  5. 201521123089 《Java程序设计》第1周学习总结

    1. 本周学习总结 学习了java的发展史以及JDK,JVM,JRE; 2. 书面作业 1.为什么java程序可以跨平台运行?执行java程序的步骤是什么? java有JVM,实在虚拟机上运行的. 2 ...

  6. 201521123003《Java程序设计》第13周学习总结

    1. 本周学习总结 以你喜欢的方式(思维导图.OneNote或其他)归纳总结多网络相关内容. 2. 书面作业 1. 网络基础 1.1 比较ping www.baidu.com与ping cec.jmu ...

  7. 【java】聊聊java里的接口

    接口的概念 java中的接口用于描述类应该具备什么样的功能,而不给出具体的实现,一个类可以“实现”多个接口 [注意]接口不是类,而是对类的一组描述   还是让我们通过一个例子来看看接口如何运作吧!   ...

  8. man page里面函数后面的括号中的数字代表的含义。

    Linux下最通用的领域及其名称及说明如下:领域 名称 说明 1 用户命令, 可由任何人启动的. 2 系统调用, 即由内核提供的函数. 3 例程, 即库函数. 4 设备, 即/dev目录下的特殊文件. ...

  9. Project Euler 92:Square digit chains C++

    A number chain is created by continuously adding the square of the digits in a number to form a new ...

  10. webservice第一篇【介绍、Scoket、http调用、wsimport调用】

    WebService介绍 首先我们来谈一下为什么需要学习webService这样的一个技术吧-. 问题一 如果我们的网站需要提供一个天气预报这样一个需求的话,那我们该怎么做????? 天气预报这么一个 ...