JavaScript 教程

什么是 JavaScript？

JavaScript 是网页的编程语言，让网页具有交互功能。与 HTML、CSS 并称 Web 三大核心技术。

基本语法

// 变量
let name = "小明";
const PI = 3.14;
var old = "不推荐使用";

// 数据类型
let num = 42;
let str = "字符串";
let bool = true;
let arr = [1, 2, 3];
let obj = {name: "小明", age: 18};

DOM 操作

// 获取元素
const title = document.querySelector("#title");
const buttons = document.querySelectorAll(".btn");

// 修改内容
title.textContent = "新标题";
title.innerHTML = "<em>新标题</em>";

// 修改样式
title.style.color = "red";
title.classList.add("active");

事件处理

const btn = document.querySelector("button");
btn.addEventListener("click", function() {
    alert("按钮被点击了！");
});

ES6+ 特性

// 箭头函数
const add = (a, b) => a + b;

// 模板字符串
const name = "小明";
console.log(`你好，${name}！`);

// 解构赋值
const [x, y] = [1, 2];
const {name, age} = person;

练习

动手实践

实现一个简易计算器：两个输入框，加减乘除四个按钮，点击后显示结果。