【JavaScript保姆级教程】JavaScript的介绍和简单语法

简介: 【JavaScript保姆级教程】JavaScript的介绍和简单语法

前言


JavaScript是一种广泛使用的脚本语言,为网页添加交互性和动态功能提供了强大的支持。在本文中,我们将深入了解JavaScript的基本概念和用法,包括它在HTML中的书写位置、注释和结束符的使用,以及一种常用的函数——alert语句。


一、javascript语言简介


JavaScript是一种轻量级的解释性脚本语言,主要用于开发Web应用程序。它提供了用于操作网页元素、处理数据和响应用户事件的功能。与其他编程语言相比,JavaScript具有简单易学的语法和丰富的内置函数库。它可以直接嵌入到HTML中,使网页具备动态交互的能力。


二、HTML中的书写位置


JavaScript可以在HTML文档中的不同位置进行书写。


1.1 内联方式

直接写到html文件中即可,如下所示:

示例代码:

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript示例</title>
</head>
<body>
  <h1>欢迎使用JavaScript</h1>
  <script>
    // 内联JavaScript代码
    alert("Hello, World!");
  </script>
</body>
</html>


d10a998162dc443c8d58ee30ce24579f.png


1.2 内部文件

通过

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript示例</title>
  <script src="script.js"></script>
</head>
<body>
  <h1>欢迎使用JavaScript</h1>
</body>
</html>


JavaScript文件(script.js):

// 外部JavaScript文件
alert("Hello, World!");



三、注释和结束符


3.1 注释

JavaScript提供了两种注释类型:单行注释和多行注释。

以//开头,用于注释单行或一部分代码。示例代码如下:

// 这是一个单行注释
// 这是另一个单行注释
多行注释:以/*开头和*/结尾,用于注释多行或一大块代码。示例代码如下:
/*
这是一个多行注释
它可以跨越多行
*/
 /*
这是另一个多行注释
它也可以在一行中结束
*/


在JavaScript中,代码块通常不需要特殊的结束符。如果你想要的话:你可以写一个分号,如下实例代码:

05ff877c95794476822093ba8ef548e7.png


四、alert语句


alert语句用于在浏览器中显示一个包含文本和一个确认按钮的对话框。

javascript

alert("欢迎访问我们的网站!");


当代码执行到此处时,将弹出一个对话框,显示消息"欢迎访问我们的网站!"。

5a9f7df0a7f844af9a14ee7d4654be2a.png

我们可以按确定,来去除这个东西!

a81a037ba8e6496f80b4190f1e3b48dc.png


总结


JavaScript是一种强大的脚本语言,广泛应用于开发Web应用程序。它可以直接嵌入到HTML中,通过内联方式或引用外部文件的方式书写。在JavaScript中,注释分为单行注释和多行注释,用于解释和注释代码。JavaScript的代码块一般不需要特殊的结束符。alert语句是常用的JavaScript函数,用于在浏览器中显示对话框。通过学习JavaScript的基础知识,我们可以为网页增添交互效果,提升用户体验。

相关文章
|
5月前
|
JavaScript 前端开发 开发者
JavaScript中的箭头函数:简洁的语法与this绑定
JavaScript中的箭头函数:简洁的语法与this绑定
474 184
|
7月前
|
机器学习/深度学习 JavaScript 前端开发
JS进阶教程:递归函数原理与篇例解析
通过对这些代码示例的学习,我们已经了解了递归的原理以及递归在JS中的应用方法。递归虽然有着理论升华,但弄清它的核心思想并不难。举个随手可见的例子,火影鸣人做的影分身,你看到的都是同一个鸣人,但他们的行为却能在全局产生影响,这不就是递归吗?雾里看花,透过其间你或许已经深入了递归的魅力之中。
321 19
|
8月前
|
JSON 前端开发 Serverless
Mock.js 语法结构全解析
Mock.js 的语法规范介绍,从数据模板定义规范和数据占位符定义规范俩部分介绍, 让你更好的使用 Mock.js 来模拟数据并提高开发效率。
|
10月前
|
资源调度 JavaScript 前端开发
前端开发必备!Node.js 18.x LTS保姆级安装教程(附国内镜像源配置)
本文详细介绍了Node.js的安装与配置流程,涵盖环境准备、版本选择(推荐LTS版v18.x)、安装步骤(路径设置、组件选择)、环境验证(命令测试、镜像加速)及常见问题解决方法。同时推荐开发工具链,如VS Code、Yarn等,并提供常用全局包安装指南,帮助开发者快速搭建高效稳定的JavaScript开发环境。内容基于官方正版软件,确保合规性与安全性。
9788 23
|
Web App开发 JavaScript 前端开发
2024年5月node.js安装(winmac系统)保姆级教程
本篇博客为2024年5月版Node.js安装教程,适用于Windows和Mac系统。作者是一名熟悉JavaScript与Vue的大一学生,分享了Node.js的基本介绍、下载链接及简单安装步骤。安装完成后,通过终端命令`node -v`验证版本即可确认安装成功。欢迎关注作者,获取更多技术文章。
590 2
2024年5月node.js安装(winmac系统)保姆级教程
|
JavaScript 前端开发
JavaScript 函数语法
JavaScript 函数是使用 `function` 关键词定义的代码块,可在调用时执行特定任务。函数可以无参或带参,参数用于传递值并在函数内部使用。函数调用可在事件触发时进行,如用户点击按钮。JavaScript 对大小写敏感,函数名和关键词必须严格匹配。示例中展示了如何通过不同参数调用函数以生成不同的输出。
|
JavaScript 前端开发
js教程——函数
js教程——函数
319 4
|
JavaScript 前端开发 大数据
在JavaScript中,Object.assign()方法或展开语法(...)来合并对象,Object.freeze()方法来冻结对象,防止对象被修改
在JavaScript中,Object.assign()方法或展开语法(...)来合并对象,Object.freeze()方法来冻结对象,防止对象被修改
251 0
|
JavaScript NoSQL 前端开发
|
JavaScript 前端开发 Java
Node.js 教程
10月更文挑战第1天
172 0