正文

轻松入门：教你如何简单引入并使用JavaScript

/0 浏览量
0816

什么是JavaScript？

JavaScript，简称JS，是一种轻量级的编程语言，主要运行在客户端（即用户的浏览器）上。自从1995年由Brendan Eich创造以来，JavaScript已经成为了网页开发中的核心技术之一。它不仅能够使网页具有动态效果，还能实现各种客户端逻辑处理，从而提升用户体验。

引入JavaScript

要将JavaScript代码添加到HTML页面中，有几种方法可以实现：

1. 内部脚本

在HTML文件的<head>或<body>标签中使用<script>标签直接写入JavaScript代码。例如：

<script>
    // 这里是JavaScript代码
    console.log("Hello, World!");
</script>

或者将JavaScript代码放在<body>标签的底部，以便在DOM元素加载完成后执行：

<script>
    // 这里是JavaScript代码
    console.log("Hello, World!");
</script>

2. 外部脚本

将JavaScript代码保存在单独的.js文件中，然后在HTML文件中通过<script>标签的src属性引入该文件。例如：

<script src="example.js"></script>

其中，example.js是存储JavaScript代码的外部文件。

3. 内联脚本

在HTML元素的onclick等事件处理程序中使用JavaScript代码。例如：

<button onclick="sayHello()">Click me!</button>

<script>
    function sayHello() {
        alert("Hello!");
    }
</script>

基础语法

下面是一些JavaScript的基础语法和概念：

变量声明

JavaScript中有几种变量声明方式：

  • var: 声明一个变量，具有变量提升的特性。
var age = 25;
console.log(age);
  • let和const: 声明一个块级作用域的变量，具有块级作用域。
let age = 25;
console.log(age);

constPI = 3.14;
console.log(PPI);

数据类型

JavaScript的数据类型包括：

  • 数值（Number）
  • 字符串（String）
  • 布尔值（Boolean）
  • 对象（Object）
  • 数组（Array）
  • null
  • undefined
let name = "Alice"; // String
let score = 88.5; // Number
let isActive = true; // Boolean
let person = {name: "Alice", age: 25}; // Object
let numbers = [1, 2, 3, 4]; // Array
let nullValue = null;
let undefinedValue = undefined;

控制结构

JavaScript的控制结构包括：

  • 条件语句（if/else）
  • 循环语句（for/while/do-while）
  • Switch语句
if (score >= 90) {
    console.log("优秀");
} else if (score >= 80) {
    console.log("良好");
} else {
    console.log("及格");
}

for (let i = 0; i < numbers.length; i++) {
    console.log(numbers[i]);
}

while (age < 30) {
    console.log("年龄小于30");
    age++;
}

switch (score) {
    case 90:
        console.log("优秀");
        break;
    case 80:
        console.log("良好");
        break;
    default:
        console.log("及格");
        break;
}

小结

通过本文的介绍，你应该已经对JavaScript有了一定的了解。掌握这些基础知识，你可以开始编写自己的JavaScript程序了。在后续的学习中，你可以进一步学习JavaScript的高级特性，如闭包、事件处理、异步编程等，使你的JavaScript技能更加丰富。

-- 展开阅读全文 --