改变HTML输出流：

在JavaScript中，document.write() 可用于直接向HTML输出流写内容

 <!DOCTYPE html>

 <html>

 <body>

 <script>

 document.write(Date());

 </script>

 </body>

 </html>

不要再文档加载之后使用document.writr()  这会覆盖文档。

改变HTML内容

修改HTML内容最简单的方法时使用innerHTML属性

 <html>

 <body>

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

 <script>

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

 </script>

 </body>

 </html>

改变HTML属性

本例改变了<img>元素的src属性

 <!DOCTYPE html>

 <html>

 <body>

 <img id="image" src="smiley.gif">

 <script>

 document.getElementById("image").src="landscape.jpg";

 </script>

 </body>

 </html>

改变HTML元素的样式

本例改变了id="id1" 的HTML元素的样式，当用户点击按钮时：

 <h1 id="id1">My Heading 1</h1>

 <button type="button" onclick="document.getElementById('id1').style.color='red'">

 点击这里

 </button>

使元素可见或不可见：

 <!DOCTYPE html>

 <html>

 <body>

 <p id="p1">这是一段文本。</p>

 <input type="button" value="隐藏文本" onclick="document.getElementById('p1').style.visibility='hidden'" />

 <input type="button" value="显示文本" onclick="document.getElementById('p1').style.visibility='visible'" />

 </body>

 </html>

javaScript改变HTML的更多相关文章

  1. 客户端的javascript改变了asp.net webform页面控件的值，后台代码中如何获取修改后的值。

    客户端的javascript改变了asp.net webform页面控件的值,后台代码中如何获取修改后的值.     无论是什么的html控件,只要加上了runat="server" ...

  2. 实时监听 JavaScript改变 input 值 input输入框内容 value 变化实时监听

    思路:通过setInterval()方法去定时对比新旧值 当时候JavaScript的onchange 和onpropertychange(注意ie版本) 监听输入框input时间,人为改变值是可以触 ...

  3. javascript改变样式（cssFloat,styleFloat）

    昨天遇到一用js改变元素浮动的,当时直接写了 obj.style.float="left";结果没起作用:查了资料后才发现不能这样写,现在整理下几种样式写法 1,直接写css属性的 ...

  4. javascript改变style样式和css样式

    转载 在很多情况下,都需要对网页上元素的样式进行动态的修改.在JavaScript中提供几种方式动态的修改样式,下面将介绍方法的使用.效果.以及缺陷. 1.使用obj.className来修改样式表的 ...

  5. js | javascript改变style样式和css样式

    转载 在很多情况下,都需要对网页上元素的样式进行动态的修改.在JavaScript中提供几种方式动态的修改样式,下面将介绍方法的使用.效果.以及缺陷. 1.使用obj.className来修改样式表的 ...

  6. 5.JavaScript改变样式,验证用户输入

    ① x=document.getElementById("demo") //找到元素 x.style.color="#ff0000"; //改变样式 ② if ...

  7. 使用javascript改变图片路径

    效果预览:http://keleyi.com/keleyi/phtml/jstexiao/16.htm 代码如下: <!DOCTYPE html> <html> <hea ...

  8. 通过JavaScript改变HTML样式

    语法:Object.style.property=new style; 基本属性表如下: 示例: 改变 <p> 元素的样式,将颜色改为红色,字号改为20,背景颜色改为蓝: <p id ...

  9. javascript改变背景/字体颜色（Through the javascript to change the background and font color）

    鼠标移动到.移出DIV时修改DIV的颜色: 1.Change the font and Div background color--function <div style="width ...

随机推荐

  1. 03002_Http请求协议分析

    1.编写一个form.html的表单页面 (1)使用EclipseEE新建一个动态的web项目: (2)Dynamic web module version选择2,5版本: (3)新建一个form.h ...

  2. PS小demo

    1.打开图像素材. 2.图层 >> 添加调整图层 >> 色相/饱和度. 得到如下效果: 3.创建新图层,将图层混合模式设为“柔光”,选择笔刷工具,硬度100%,按下图所示绘制该 ...

  3. CEF与代理

    此文已由作者王荣涛授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. CEF(Chromium Embedded Framework)如今已经广泛被应用于客户端软件,网易内部就有 ...

  4. python003 Python3 基本数据类型

    Python3 基本数据类型Python 中的变量不需要声明.每个变量在使用前都必须赋值,变量赋值以后该变量才会被创建.在 Python 中,变量就是变量,它没有类型,我们所说的"类型&qu ...

  5. zoj 1383 Binary Numbers

    Binary Numbers Time Limit: 2 Seconds      Memory Limit: 65536 KB Given a positive integer n, print o ...

  6. Linux基础之基本命令cat less more sort uniq alias 命令行 bash简单描述（三）

    获取Linux当前最新的内核版本号经常关注www.kernel.org 目录管理:ls cd pwd mkdir rmdir tree 文件管理:touch stat file rm cp mv na ...

  7. hihoCoder#1105 题外话·堆

    原题地址 有没有更优雅地堆模板啊,总感觉我写的有些啰嗦 代码: #include <iostream> using namespace std; #define MAX_NODE 1000 ...

  8. linux 常见名词及命令（一）

    linux  PK  wondows 稳定且有效率.免费或少许费用.漏洞少且修补快.多任务多用户. 安全的用户及文件权限策略.适合小内核程序的嵌入系统.相对不耗资源. 热门的开源系统 红帽企业系统(R ...

  9. 洛谷—— P2802 回家

    P2802 回家 题目描述 小H在一个划分成了n*m个方格的长方形封锁线上. 每次他能向上下左右四个方向移动一格(当然小H不可以静止不动), 但不能离开封锁线,否则就被打死了. 刚开始时他有满血6点, ...

  10. 压力测试webbench（转）

    最近app需要搭建后台,故此研究一下,靠谱的后台服务器..网传nginx 能达到的并发数量比apache 高. LAMP or LNMP ? 根据需求测试结果来进行选择. 首先是安装LNMP测试完后 ...