JavaScript 通常用于操作 HTML 元素。

操作 HTML 元素

如需从 JavaScript 访问某个 HTML 元素，您可以使用 document.getElementById(id) 方法。

请使用 "id" 属性来标识 HTML 元素：

例子

通过指定的 id 来访问 HTML 元素，并改变其内容：

<!DOCTYPE html>

<html>

<body>

<h1>My First Web Page</h1>

<p id="demo">My First Paragraph.</p>

<script>

document.getElementById("demo").innerHTML="My First JavaScript";

</script>

</body>

</html>

效果:

My First Web Page

My First JavaScript

JavaScript 由 web 浏览器来执行。在这种情况下，浏览器将访问 id="demo" 的 HTML 元素，并把它的内容（innerHTML）替换为 "My First JavaScript"。

写到文档输出

下面的例子直接把 <p> 元素写到 HTML 文档输出中：

<!DOCTYPE html>

<html>

<body>

<h1>My First Web Page</h1>

<script>

document.write("<p>My First JavaScript</p>");

</script>

</body>

</html>

效果:

My First Web Page

My First JavaScript

警告

请使用 document.write() 仅仅向文档输出写内容。

如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖：

实例

<!DOCTYPE html>

<html>

<body>

<h1>My First Web Page</h1>

<p>My First Paragraph.</p>

<button onclick="myFunction()">点击这里</button>

<script>

function myFunction()

{

document.write("糟糕！文档消失了。");

}

</script>

</body>

</html>

效果:

My First Web Page

My First Paragraph.

点击这里文档消失

Windows 8 中的 JavaScript

提示：微软支持通过 JavaScript 创建 Windows 8 app。

对于因特网和视窗操作系统，JavaScript 都意味着未来。

前端之JavaScript第一天学习(3)-JavaScript输出的更多相关文章

  1. 前端之JavaScript第一天学习(1)-JavaScript 简介

    javaScript 是世界上最流行的编程语言. 这门语言可用于 HTML 和 web,更可广泛用于服务器.PC.笔记本电脑.平板电脑和智能手机等设备. JavaScript 是脚本语言 JavaSc ...

  2. 前端之JavaScript第一天学习(2)-JavaScript 使用

    HTML 中的脚本必须位于 <script> 与 </script> 标签之间.脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中 ...

  3. JavaScript第一阶段学习心得

    开始接触JavaScript是从慕课网开始的,基础篇学完.懵了一逼,可能是自己太蠢.感觉跟没学差不多,属性,方法,对象,什么都不懂.有的方法知道起的是什么效果,但是原理什么的都不知道. 还好,基础篇学 ...

  4. Javascript 第一阶段 学习使用总结

    JavaScript 是一种轻量级的编程语言.JavaScript 是可插入 HTML 页面的编程代码.脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中 ...

  5. 前端框架Vue------＞第一天学习、Vue学习的路径、Vue官网（1）

    文章目录 1.学习目标 2.前端知识体系 2.1 前端三要素 2.2.MVVM 3.第一个Vue程序 4.Vue实例的生命周期 vue的官方文档:https://cn.vuejs.org/ 1.学习目 ...

  6. 前端框架Vue------＞第一天学习（3）

    文章目录 8 .使用Axios实现异步通信 9 .表单输入绑定 9.1 . 什么是双向数据绑定 9.2 .为什么要实现数据的双向绑定 9.3 .在表单中使用双向数据绑定 8 .使用Axios实现异步通 ...

  7. 前端框架Vue------＞第一天学习（2） v-if

    API:https://cn.vuejs.org/v2/api/#key 文章目录 5.条件渲染 5.1 . v-if 5.2 . v-else-if 6 .列表渲染 7 .事件监听 5.条件渲染 5 ...

  8. JavaScript 权威指南-学习笔记（一）

    本文所有教程及源码.软件仅为技术研究.不涉及计算机信息系统功能的删除.修改.增加.干扰,更不会影响计算机信息系统的正常运行.不得将代码用于非法用途,如侵立删! ## JavaScript 权威指南-学 ...

  9. 5月31日 python学习总结 JavaScript概述

    JavaScript概述 ECMAScript和JavaScript的关系 1996年11月,JavaScript的创造者--Netscape公司,决定将JavaScript提交给国际标准化组织ECM ...

随机推荐

  1. php的命名规范

    1.类 类名每一个单词首字母大写,如类名StudentCourse. 2.常量 常量名所有字母大写,单词间用下划线分隔,如常量名NULL.TRUE.FALSE.ROOT_PATH等. 3.变量 为了保 ...

  2. JavaScript高级 面向对象的程序设计 （一）《JavaScript高级程序设计（第三版）》

    创建对象 继承 面向对象的语言都有一个表示---类.通过类我们可以创建多个具有相同属性的对象.但是,在JS中并没有类的概念,所以JS的对象也和其他语言的对象不同. 对象的定义:无序的属性集合,其属性可 ...

  3. oracle的表名、字段名、constraint名的长度限制分别是多少？

    文章出处:http://blog.csdn.net/haiross/article/details/38379615 Oracle:表名.字段名.constraint名的长度有限制 oracle 的命 ...

  4. 掌握iOS自动布局

    1,自动布局是一种基于约束的布局(constraint-based layout)引擎,它可以根据开发者在对象上的约束自动调整大小与位置. 2.在iOS 6之前使用的布局模型是“spring& ...

  5. sqoop的codegen工具

    一.codegen工具的使用 sqoop codegen --connect jdbc:mysql://localhost:3306/test --username root --password 1 ...

  6. Redis监控方案

    Redis 监控最直接的方法当然就是使用系统提供的 info 命令来做了,你只需要执行下面一条命令,就能获得 Redis 系统的状态报告. redis-cli info 内存使用 如果 Redis 使 ...

  7. java作用域public ,private ,protected 及不写时的区别(转)

    在说明这四个关键字之前,我想就class之间的关系做一个简单的定 义,对于继承自己的class,base class可以认为他们都是自己的子 女,而对于和自己一个目录下的classes,认为都是自己的 ...

  8. javascripy的innerHTML在IE8下的异常

    使用jQuery的datatable插件的时候发现,IE8下显示异常,仔细调查一番,发现是浏览器对innerHTML的差异导致的. 实例代码: var nTd = document.createEle ...

  9. matlab封装DLL混合编程总结

    最近做了个项目要用到matlab做些算法处理,然后用.net项目调用这个类,我把这个matlab封装dll总结了下如下: matlab是商业数学软件,优势是在算法开发上面有很强的功能,提供了很多数学算 ...

  10. WPF：定制Checkbox样式，让“正确”绿得好看，让“错误”红的显眼

    WPF提供了样式.模板.触发器.状态管理.矢量形状等方式,让我们不需要背景图片,也可以轻松定制控件的风格样式.下面是笔者针对Checkbox进行的样式定制,让“正确”绿得好看,让“错误”红的显眼.  ...