JavaScript的知识点

li宾是我哥

已于 2022-08-02 17:18:47 修改

阅读量179

点赞数

文章标签： javascript 前端 html

于 2022-08-01 20:34:51 首次发布

本文链接：https://blog.csdn.net/gx01013/article/details/126109079

版权

这篇博客介绍了JavaScript的基础知识，包括它作为脚本语言的特性、在HTML中的使用方式以及如何显示数据。文章详细讲解了条件语句（if、if...else、if...elseif...else、switch）和循环（for、while、do/while）的语法与实例，适合初学者学习JavaScript编程。

摘要由CSDN通过智能技术生成

简介

JavaScript 是互联网上最流行的脚本语言，这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。

JavaScript 是脚本语言

JavaScript 是一种轻量级的编程语言。

JavaScript 是可插入 HTML 页面的编程代码。

JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。

JavaScript 很容易学习。

用法

HTML 中的 Javascript 脚本代码必须位于 <script> 与 </script> 标签之间。

Javascript 脚本代码可被放置在 HTML 页面的 <body> 和 <head> 部分中，也可以放置在<html>外。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落。</p>");
</script>
</body>
</html>

JavaScript 显示数据

使用 window.alert() 弹出警告框。
使用 document.write() 方法将内容写到 HTML 文档中。
使用 innerHTML 写入到 HTML 元素。
使用 console.log() 写入到浏览器的控制台。

<script>
     var num = parseInt(prompt("请输入你的年龄"))
</script>

条件语句

if 语句 - 只有当指定条件为 true 时，使用该语句来执行代码
if...else 语句 - 当条件为 true 时执行代码，当条件为 false 时执行其他代码
if...else if....else 语句- 使用该语句来选择多个代码块之一来执行
switch 语句 - 使用该语句来选择多个代码块之一来执行

if 语法

if...else 语法

if (condition)
{
    当条件为 true 时执行的代码
}
else
{
    当条件不为 true 时执行的代码
}

实例：

<script>
        var num = parseInt(prompt("请输入你的年龄"))
        if (num < 18) {
            alert("警告：你还未成年，不能使用该软件！")
        } else {
            alert("你已经成年，可以使用该软件。")
        }
    </script>

if...else if....else 语法

if (condition1)
{
    当条件 1 为 true 时执行的代码
}
else if (condition2)
{
    当条件 2 为 true 时执行的代码
}
else
{
  当条件 1 和 条件 2 都不为 true 时执行的代码
}

实例：

<script>
        var num = parseInt(prompt("请输入你收入"))
        if (num >= 20000) {
            alert("三亚7日游！")
        } else if (num >= 10000) {
            alert("省内5日游")
        } else if (num == 5000) {
            alert("买一套喜欢的衣服，就不出去了")
        } else {
            alert("老老实实上班吧！")
        }
    </script>

switch 语法

switch(n)
{
    case 1:
        执行代码块 1
        break;
    case 2:
        执行代码块 2
        break;
    default:
        与 case 1 和 case 2 不同时执行的代码
}

实例：

 <script>
        var num = parseInt(prompt("请输入对应的商品购买数字"))
        switch (num) {
            case 1:
                alert("未付款")
                break;
            case 2:
                alert("已付款")
                break;
            case 3:
                alert("代发货")
                break;
            case 4:
                alert("已发货")
                break;
            case 5:
                alert("运输中")
                break;
            case 6:
                alert("已签收")
                break;

            default:
                alert("请输入正确的商品购买数字")
                break;
        }

JavaScript 循环

JavaScript 支持不同类型的循环：

for - 循环代码块一定的次数
while - 当指定的条件为 true 时循环指定的代码块
do/while - 同样当指定的条件为 true 时循环指定的代码块

for 循环的语法：

for (语句 1; 语句 2; 语句 3)
{
    被执行的代码块
}

实例：

<!-- 学校让老师挑出班里面五个学生的成绩录入成绩系统，录入完毕求出这五个学
生的平均分是多少，请使用for循环实现。 -->
    <script>
        var result = 0
        for (i = 1; i < 6; i++) {
            var sum = parseInt(prompt("请输入第" + i + "的成绩"))
            result += sum
        }
        alert("平均数是" + result / 5)
    </script>

while 循环的语法：

while (条件)
{
    需要执行的代码
}

实例：

<script>
      循环输出10遍“利宾一家人”
      var i = 1
      while (i<11) {
      document.write("利宾一家人")
      document.write("<br>")
      //逐渐接近结束循环的语句
      i++
      }
</script>

do/while 循环的语法：

do
{
    需要执行的代码
}
while (条件);

实例：

<script>
      var l = 1
        do {
        document.write("利宾一家人")
        document.write("<br>")
        l++
        } while (l < 11);
</script>

li宾是我哥

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫