正文 

当前位置： 首页 > 技术 > java教程

编写第一个javascript程序(代码片段)

Rannie Rannie     2022-12-24     187

关键词：

编写第一个程序

在 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>

编写第一个qt程序(代码片段)

.../view/1817.html 学习一种编程语言或编程环境，通常会先编写一个“HelloWorld”程序。我们也用QtCreator编写一个“HelloWorld”程序，以初步了解QtCreator设计应用程序的基本过程，对使用QtCreator编写QtC++应用程序建立初步... 查看详情

如何用javascript编写你的第一个单元测试(代码片段)

...的开发和部署过程中。这些框架通常支持在前端和后端的JavaScript代码中进行测试。下面是一些帮助你编写性能单元测试和可测试代码的一般准则。保持简短不要让你的单元测试冗余。测试应该只有几行代码，检查应用程序的... 查看详情

javascript第一个程序(代码片段)

 JavaScript三种信息输出方式：1）alert()：警示框弹出消息2）document.write()：页面输出信息3）console.log()：浏览器控制台输出信息 html代码:<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname=" 查看详情

编写第一个python程序(yourfirsrprogram)(代码片段)

1)代码如下：11#Thisprogramsayshelloandasksformyname.22myName=input("Whatisyourname?")33print(‘itisgoodtomeetyou,‘+myName)#askforyourname44print(‘itisgoodtomeetyou[%s]‘%myName)5566print(‘thelengthofyourname 查看详情

编写第一个java程序：helloworld(代码片段)

配置好java开发环境后，我们可以编写第一个java程序（helloworld）。在开始编写java程序时，我们要知道java程序开发的三个步骤：编写、编译、运行。编写阶段主要是由程序员编写后缀为.java的文件；将后缀... 查看详情

javascript[第一个程序]添加第一个progarm＃tag1＃tag2(代码片段)

查看详情

编写第一个裸机程序(代码片段)

一.ARM裸机之Makefile　　1.1.Makefile分析led.bin:led.oarm-linux-ld-Ttext0x0-oled.elf$^arm-linux-objcopy-Obinaryled.elfled.binarm-linux-objdump-Dled.elf>led_elf.disgccmkv210_image.c-omkx210./mkx210led.bin210 查看详情

javaweb开发（编写第一个servlet程序）(代码片段)

...。联系信箱：feixiaoxing@163.com】    之前从来没有编写过servlet程序，更没有用tomcat部署过javaweb程序。所以，趁着IDEA安装好、maven配置好，开始用IDEA编写第一个servlet程序。整个操作过程参考了 查看详情

javaweb开发（编写第一个servlet程序）(代码片段)

...。联系信箱：feixiaoxing@163.com】    之前从来没有编写过servlet程序，更没有用tomcat部署过javaweb程序。所以，趁着IDEA安装好、maven配置好，开始用IDEA编写第一个servlet程序。整个操作过程参考了 查看详情

编写第一个mfc应用程序(代码片段)

一、MFC简介微软基础类库（英语:MicrosoftFoundationClasses,简称MFC）是一个微软公司提供的类库（classlibraries），以C++类的形式封装了WindowsAPI，并且包含一个应用程序框架，以减少应用程序开发人员的工作量，其中包含的类包含大量Wi... 查看详情

使用kotlin编写你的第一个firefoxwebextension扩展(代码片段)

...以快速被安卓和服务端采用。事实上，Kotlin还支持编译成JavaScript，因此该语言也开始在Web生态系统中受到关注。尽管已经发布了许多Kotlin编写的Web应用程序，但至今人们都忽略了Kotlin还可以写浏览器扩展插件。所以我写了这篇... 查看详情

nodemcu学习笔记---编写第一个nodemcu程序“helloworld!“(代码片段)

NodeMCU学习笔记（2）—编写第一个NodeMCU程序"HelloWorld!"提示：作者使用ESP8266进行开发学习。文章目录前言一、主程序（初始化程序）二、程序下载三、查看输出信息四、总结前言    根据文章《NodeMCU... 查看详情

编写第一个qt程序(代码片段)

目录1.首先单击QtCreator的菜单项文件->新建文件或项目2.单击“Choose…”按钮，填写项目名称和存储位置 3.选择编译工具4.选择语言 5.可以将这几个编译工具都选中，在编译项目时再选择一个作为当前使用的编译工具 6.... 查看详情

编写第一个qt程序(代码片段)

目录1.首先单击QtCreator的菜单项文件->新建文件或项目2.单击“Choose…”按钮，填写项目名称和存储位置 3.选择编译工具4.选择语言 5.可以将这几个编译工具都选中，在编译项目时再选择一个作为当前使用的编译工具 6.... 查看详情

编写你的第一个django应用程序，第6部分(代码片段)

...通常需要提供呈现完整网页所需的其他文件（例如图像、JavaScript或CSS）。在Django中，我们将这些文件称为“静态文件”。对于小型项目，这没什么大不了的，因为您可以将静态文件保存在Web服务器可以找到的地方。但是，在较... 查看详情

编写第一个ros程序-发布器(publisher)(代码片段)

在上一篇文章中我们安装好了ROS环境。本篇文章我们将熟悉ROS中的一些概念（Concept），并尝试使用C++来实现一个发布器(Publisher)和一个订阅器(Subscriber)。该文章是个人学习ROS的过程记录，参考的书是中文版《ROS机器人编程：原理... 查看详情

1_第一个java程序的编写和运行(代码片段)

1.新建hello.java文件classhellopublicstaticvoidmain(String[]args)System.out.print("helloWorld");2.使用javac编译.java文件，会在该目录下生成一个.class的字节码文件,生成的名字为class的名字，如上面的为hello.classjavachello.java3.使用jav 查看详情

python学习总结，第一个python程序的编写(代码片段)

1.python是一种解释性，编译型，互动型的语言，面向对象，动态数据类型的高级程序设计语言。1.1交互式：意味着可以在一个提示符直接交互执行你写的程序。1.2解释型：意味着开发过程中没有编译这个环节。1.3面向对象：意味... 查看详情