编写第一个程序

在 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. 前缀和-Big Water Problem （牛客）

    链接:https://ac.nowcoder.com/acm/problem/15164 题目描述 给一个数列,会有多次询问,对于每一次询问,会有两种操作: 1:给定两个整数x, y, 然后在原数组的 ...

  2. 从零构建以太坊（Ethereum）智能合约到项目实战——第23章 从零构建和部署去中心化投票App，decentralization Voting Dapp

    P90 .1-从零构建和部署去中心化投票App-01 P91 .2-从零构建和部署去中心化投票App-02 P92 .3-从零构建和部署去中心化投票App-03 参考博文:http://liyuech ...

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版：设定文本小写

    <!DOCTYPE html> <html> <head> <title>菜鸟教程(runoob.com)</title> <meta ...

  4. Fiddler抓包（基本使用方法、web+app端抓包、篡改数据、模拟低速）

    1.HTTP代理原理图 http服务器代理:既是web服务器,又是web客户端 接口vs端口: 接口:包含地址和端口 端口:类似于USB接口 地址:127.0.0.1,端口默认:8888        ...

  5. ORACLE CPU过高的sql查询

    1. 根据占用CPU高的进程号来查询这个进程执行的SQL语句: CPU过高的进程号: #首先找到CPU过高的进程号 # top -bn1 是静态找到占用最高的进程   [root@localhost ...

  6. ORACLE 判断首字母大小写问题

    1.对判断的字段进行拆分 select  substr(要区分的字段,0,1)  from 表 : 得到一个 首字母 2.对这个字符进行大小写判断 查出以小写字符为开头的 select  substr ...

  7. 「SP10628 COT - Count on a tree」

    主席树的综合运用题. 前置芝士 可持久化线段树:其实就是主席树了. LCA:最近公共祖先,本题需要在\(\log_2N\)及以内的时间复杂度内解决这个问题. 具体做法 主席树维护每个点到根节点这一条链 ...

  8. 重识线段树——Let's start with the start.

    声明 本文为 Clouder 原创,在未经许可情况下请不要随意转载.原文链接 前言 一般地,这篇文章是给学习过线段树却仍不透彻者撰写的,因此在某些简单的操作上可能会一笔带过. 当然了,入门线段树后也可 ...

  9. 「JOI2019 Final」解题报告

    传送门 「JOI2019 Final」勇者比太郎 看懂题就很简单了,后缀和随便维护一下就好了,别用树状数组强加一个\(\log\)就行. 「JOI2019 Final」画展 显然可以先把所有的画框按大 ...

  10. sqlserver 面试题

    1. --是查询A(ID,Name)表中第11至20条记录,ID作为主键可能是不是连续增长的列,完整的查询语句如下: SELECT TOP 10 * FROM dbo.Employee WHERE E ...