JavaScript 教程

JavaScript(简称“JS”)是一种轻量级,解释型或即时编译型的编程语言,通常用于 Web 页面的开发。JavaScript 支持面向对象、命令式和声明式(如函数式编程)风格。

 

1. JavaScript 是脚本语言

  • JavaScript 是一种轻量级的编程语言。
  • JavaScript 可以插入页面的 HTML 代码中。
  • JavaScript 在 HTML 页面中可由浏览器执行。
  • JavaScript 语法比较简单,很容易学习。

 

2. 为什么学习 JavaScript

JavaScript 是前端开发者必须学习的三门语言中的一门。前端三门语言包括:HTML、CSS、JavaScript,它们的主要用处:

  • HTML 定义了网页的内容。
  • CSS 描述了网页的布局。
  • JavaScript 控制网页的行为。

本教程我们将介绍 JavaScript 和学习如何使用 JavaScript 与 HTML 和 CSS 一起工作。

 

3. JavaScript 范例

我们提供了一些范例,用来展示 JavaScript 的能力。

1)JavaScript 能够改变 HTML 内容

getElementById() 是多个 JavaScript HTML 方法之一。

本例使用该方法来“查找” id="demo" 的 HTML 元素,并把元素内容(innerHTML)更改为 "Hello JavaScript":

范例:

document.getElementById("demo").innerHTML = "Hello JavaScript";

我要试一试

提示:JavaScript 同时接受双引号和单引号:

范例:

document.getElementById("demo").innerHTML = 'Hello JavaScript';

我要试一试

2)JavaScript 能够改变 HTML 属性

本例通过改变 <img> 标签的 src 属性(source)来改变一张 HTML 图像:

范例:


我要试一试

3)JavaScript 能够改变 HTML 样式 (CSS)

改变 HTML 元素的样式,是改变 HTML 属性的一种变种:

范例:

document.getElementById("demo").style.fontSize = "25px";

我要试一试

JavaScript 使用:<script> 标签:在 HTML 中,JavaScript 代码必须位于 <script> 与 </script>< /span> 标签之间。 <head> 或 <body> 中的 JavaScript。您能够在 HTML 文档中放置任意数量的脚本。脚本可被放置与 HTML 页面的 <body> 或 <head> 部分中,或兼而有之。