编写第一个程序

在 HTML 页面中嵌入 JavaScript 脚本需要使用 <script> 标签，用户可以在 <script> 标签中直接编写 JavaScript 代码，具体步骤如下。

第 1 步，新建 HTML 文档，保存为 test.html。

第 2 步，在 <head> 标签内插入一个 <script> 标签。

第 3 步，为 <script> 标签设置type="text/javascript"属性。

现代浏览器默认 <script> 标签的脚本类型为 JavaScript，因此可以省略 type 属性；如果考虑到兼容早期版本浏览器，则需要设置 type 属性。

第 4 步，在 <script> 标签内输入 JavaScript 代码：document.write("<h1>Hi,JavaScript!</h1>")；

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>第一个JavaScript程序</title>

    <script type="text/javascript">

        document.write("<h1>Hi,JavaScript!</h1>");

    </script>

</head>

<body></body>

</html>

新建 JavaScript 文件

JavaScript 程序不仅可以直接放在 HTML 文档中，也可以放在 JavaScript 文件中。

JavaScript 文件是文本文件，扩展名为.js，使用任何文本编辑器都可以编辑。新建 JavaScript 文件的步骤如下。

第1步，新建文本文件，保存为 test.js。注意，扩展名为.js，它表示该文本文件是 JavaScript 类型的文件。

第2步，打开 test.js 文件，在其中编写如下 JavaScript 代码。

alert("Hi,JavaScript!");

在上面代码中，alert() 表示 Window 对象的方法，调用该方法将弹出一个提示对话框，显示参数字符串 "Hi, JavaScript!"。

第3步，保存 JavaScript 文件。在此建议把 JavaScript 文件和网页文件放在同一个目录下。

JavaScript 文件不能够独立运行，需要导入到网页中，通过浏览器来执行。使用 <script> 标签可以导入 JavaScript 文件。

第4步，新建 HTML 文档，保存为 test.html。

第5步，在 <head> 标签内插入一个 <script> 标签。定义 src 属性，设置属性值为指向外部 JavaScript 文件的 URL 字符串。代码如下：

<script type="text/javascript" src="test.js"></script>

第6步，保存网页文档，在浏览器中会弹出 “Hi,JavaScript!”

定义 src 属性的 <script> 标签不应再包含 JavaScript 代码。

如果嵌入了代码，则只会下载并执行外部 JavaScript 文件，嵌入代码将被忽略。

执行 JavaScript 程序

浏览器在解析 HTML 文档时，将根据文档流从上到下逐行解析和显示。

JavaScript 代码也是 HTML 文档的组成部分，因此 JavaScript 脚本的执行顺序也是根据 <script> 标签的位置来确定的。

示例

使用浏览器测试下面示例，会看到 JavaScript 代码从上到下逐步被解析的过程。

<!DOCTYPE html>

<script>

    alert("顶部脚本");

</script>

<html>

<head>

    <meta charset="UTF-8">

    <title>test</title>

    <script>

        alert("头部脚本");

    </script>

</head>

<body>

    <h1>网页标题</h1>

    <script>

        alert("页面脚本");

    </script>

    <p>正文内容</p>

</body>

<script>

    alert("底部脚本");

</script>

</html>

编写第一个JavaScript程序的更多相关文章

  1. 搭建java开发环境、使用eclipse编写第一个java程序

    搭建java开发环境.使用eclipse编写第一个java程序 一.Java 开发环境的搭建 1.首先安装java SDK(简称JDK). 点击可执行文件 jdk-6u24-windows-i586. ...

  2. 【安装eclipse, 配置java环境教程】 编写第一个java程序

    写java通常用eclipse编写,还有一款编辑器比较流行叫IJ.这里我们只说下eclipse编写java的前期工作. 在安装eclipse之前要下载java的sdk文件,即java SE:否则无法运 ...

  3. 【C#入门教案-02】用记事本编写第一个C#程序-Hello World

    02-用记事本编写第一个C#程序-Hello World 广东职业技术学院  欧浩源 [1]进行.NET程序开发的最基本环境配备 .NET Framework + 代码编辑工具(记事本或Noetpad ...

  4. 一起学Hadoop——使用IDEA编写第一个MapReduce程序(Java和Python)

    上一篇我们学习了MapReduce的原理,今天我们使用代码来加深对MapReduce原理的理解. wordcount是Hadoop入门的经典例子,我们也不能免俗,也使用这个例子作为学习Hadoop的第 ...

  5. 从零自学Java-1.编写第一个Java程序

    编写第一个Java程序 完成工作:1.在文本编辑器中输入一个Java程序. 2.使用括号组织程序. 3.保存.编译和运行程序. package com.Jsample;//将程序的包名称命名为com. ...

  6. Java笔记：编写第一个Java程序

    2017.6.17 1.编写第一个Java程序 创建text文本,命名第一个Java程序.txt 在里面编写Java代码 public class Demo1{ public static void ...

  7. 假期作业02：安装JDK与文本编辑器并编写第一个Java程序

    假期作业02:安装JDK与文本编辑器并编写第一个Java程序 一.安装JDK与文本编辑器并编写第一个java程序 首先在oracle官网(需要创建账号,进行登录后方可使用)按照自己的需求下载JDK(h ...

  8. 编写高效的JavaScript程序

    作者: Addy Osmani  来源: CSDN  发布时间: 2013-01-10 14:15  阅读: 7952 次  推荐: 15   原文链接   [收藏] 英文原文:Writing Fas ...

  9. 编写第一个MapReduce程序—— 统计气温

    摘要:hadoop安装完成后,像学习其他语言一样,要开始写一个“hello world!” ,看了一些学习资料,模仿写了个程序.对于一个C#程序员来说,写个java程序,并调用hadoop的包,并跑在 ...

随机推荐

  1. 高级T-SQL进阶系列 （一）【上篇】：使用 CROSS JOIN 介绍高级T-SQL

    [译注:此文为翻译,由于本人水平所限,疏漏在所难免,欢迎探讨指正] 原文连接:传送门 这是一个新进阶系列的第一篇文章,我们将浏览Transact-SQL(T-SQL)的更多高级特性.这个进阶系列将会包 ...

  2. mysql update 修改多个字段and的语法问题

    在MySQL里面update一条记录,语法都正确的,但记录并没有被更新... 问题语句 执行之前的记录是这样的: 执行之后的记录是这样的: 可以看到,实际上是有效果的: why? 看起来,语法是完全没 ...

  3. [ NLP ] CS224N 学习笔记

    Lecture1 One-Hot 定义:用N位状态寄存器编码N个状态,每个状态都有独立的寄存器位,且这些寄存器位中只有一位有效,说白了就是只能有一个状态.即保证每个样本中的每个特征只有1位处于状态1, ...

  4. redhat 7.6 流量监控命令、软件（3）nethogs 监控进程实时流量

    1.解压nethogs tar -zxvpf nethogs_0.8.5.orig.tar.gz 2.直接make,这里报错,提示pcap.h,安装libpcap就可以了 3.如果已经安装,还是报错, ...

  5. 「JSOI2014」歌剧表演

    「JSOI2014」歌剧表演 传送门 没想到吧我半夜切的 这道题应该算是 \(\text{JSOI2014}\) 里面比较简单的吧... 考虑用集合关系来表示分辨关系,具体地说就是我们把所有演员分成若 ...

  6. Linux下给mysql创建用户并分配权限

    // fe_group 用户名// fe 数据库名// 123456 密码 1.新建用户 //登录MYSQL @>mysql -u root -p @>密码 //创建用户 mysql> ...

  7. Preparing for the interview of FLAG and USDA

    7,Dynamic Programming 1,Unique Paths A robot is located at the top-left corner of a m x n grid (mark ...

  8. GO闭包

    package main import "fmt" func main() { add_func := add(1,2) fmt.Println(add_func(1,1)) fm ...

  9. navicat12破解详细教程

    以管理员身份运行此注册机: 运行注册机 打开注册机后,1) Patch勾选Backup.Host和Navicat v12,然后点击Patch按钮: 默认勾选 找到Navicat Premium 12安 ...

  10. 报错PKIX path building failed: sun.security.provider.certpath.SunCertPathBuilderException: unable to find valid certification path to requested target"

    今天在调用第三方HTTPS接口的时候,一直显示这个报错,然后百度很久,有2种解决方法,一个是说自己手动去导入,第二种用代码忽略证书验证.我用二种方式, 复制即用, public void test2( ...