【JavaScript】书写位置、注释、输入输出

早睡早起长头发

已于 2022-11-05 10:49:00 修改

阅读量1.1k

点赞数 1

分类专栏： JavaScript 文章标签： javascript 前端 html

于 2022-08-29 14:47:45 首次发布

本文链接：https://blog.csdn.net/weixin_51481135/article/details/126506719

版权

JavaScript 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

一、JavaScript代码的3种书写位置

一、JavaScript代码的3种书写位置

1.行内式

将单行或少量的JavaScript代码写在HTML标签的事件属性中。

例1：

<body>
    <a href="javascript:alert('长头发')">早睡早起</a>
</body>

例2：

<button onclick="alert('烧鸡烧鹅')">吃什么</button>

例3：

<input type="button" value="喝什么" onclick="alert('可乐雪碧')">

2.内嵌式（嵌入式）

使用<script>标签包裹JavaScript代码，<script>标签可以写在<head>或<body>标签中。

例1：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 内嵌式 -->
    <script type="text/javascript">
        function show(){
            alert('吃烧烤')
        }
    </script>
</head>
<body>
    <button onclick="show()">吃什么</button>
</body>
</html>

3.外部式（外链式）

将JavaScript代码写在一个单独的文件中，一般使用“js”作为文件的扩展名，在HTML页面中使用<script>标签进行引入，适合JavaScript代码量比较多的情况。

注意：外部式的<script>标签内不可以编写JavaScript代码。

在编写JavaScript代码时，需要注意基本的语法规则：

JavaScript严格区分大小写，在编写代码时一定注意大小写的正确性
JavaScript代码对空格、换行、缩进不敏感，一条语句可以分成多行书写
如果一条语句结束后，换行书写下一条语句，后面的分号可以省略

例1：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 外链式 -->
    <script src="../js/test.js"></script>
</head>
<body>
    <input type="button" value="喝什么" onclick="f1()">
</body>
</html>

二、JavaScript的基本语法

1、标识符：字符串

①严格区分大小写

②可以由字母、数字、下划线和$组成,必须以字母或下划线开头不能以数字开头

2、对空格、换行、缩进不敏感（所以一条语句可以分多行来书写）

3、一条语句结束后末尾可以带分号，也可以不带分号

三、注释

JavaScript代码的注释方式，以及在VS Code编辑器中对应的快捷键如下：

单行注释：以“//”开始，到该行结束或<script>标签结束之前的内容都是注释。快捷键：ctrl + /
多行注释：以“ /*”开始，以 “*/”结束。需要注意的是，多行注释中可以嵌套单行注释，但不能再嵌套多行注释。快捷键：shift + alt + a

四、在浏览器中如何测试js代码

第一步：打开浏览器的开发者工具

第二步：

Elements：看到页面元素的样式等信息
Console：终端的输出信息
Network：向后台发起请求时，看到远程服务器的反应效果
Memory：内存的分配情况
Application：页面存储技术

五、输入和输出语句

JavaScript代码中提供了输入和输出语句，可以在网页中实现用户交互效果。常用的输入和输出语句如下所示：

alert(msg) ：浏览器弹出警告框。是一个消息提示框(只有一个确定按钮的对话框)。
prompt(msg)：浏览器弹出输入框，用户可以输入内容，当用户点击'确定'按钮时，返回用户输入的信息；当用户点击'取消'按钮时，关闭窗口。
confirm(msg)：确认对话框(含有确定和取消按钮的对话框)，当用户点击'确定'按钮时该函数返回true，当用户点击"取消"按钮时返回false。
console.log(msg) ：浏览器控制台输出信息。
console.info()
console.error()

1.alert(msg)

    <script>
        alert('这是一个警告框')
    </script>

2.prompt(msg)

<script>	
   prompt('这是一个输入框');
</script>

使用：

<script>
var uname = prompt('请输入您的姓名');
console.log('您的姓名是：',uname);
</script>

控制台会输出用户在弹出输入框输入的内容。

3.confirm(msg)

<script>
    confirm('确认删除吗')
</script>

使用：

<script>
// confirm(msg)：确认对话框(含有确定和取消按钮的对话框)，当用户点击'确定'按钮时该函数返回true，当用户点击"取消"按钮时返回false。
var flag = confirm('确认删除吗')
console.log('用户的选择是：',flag)
</script>

如果选择“确定”，控制台输出“true”；如果选择“取消”，控制台输出“false”。

4.console.log(msg)

    <script>
        console.log('在控制台输出信息');
    </script>

早睡早起长头发

关注

1
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
【JavaScript】书写位置、注释、输入输出

一、JavaScript代码的3种书写位置1.行内式2.内嵌式（嵌入式）3.外部式（外链式）二、基本语法三、注释单行注释多行注释四、在浏览器中如何测试js代码五、输入和输出语句alert(msg) ：浏览器弹出警告框console.log(msg) ：浏览器控制台输出信息prompt(msg)：浏览器弹出输入框，用户可以输入内容......
复制链接

扫一扫