<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "段落被更改。";
}
</script>
</head>
<body>
<h1>一张网页</h1>
<p id="demo">一个段落</p>
<button type="button" onclick="myFunction()">试一试</button>
</body>
</html>
js定义代码，可放在网页代码的head/body/footer任意位置。单双引号都可以。
还可以作为外部文件，让许多网页共用。
脚本可放置与外部文件中：
如需使用外部脚本，请在 <script> 标签的 src (source) 属性中设置脚本的名称：
<script src="myScript.js"></script>
可同时放几个，当前目录、外网、本网其它目录
<script src="myScript1.js"></script> <script src="myScript2.js"></script>
<script src="https://www.w3school.com.cn/js/myScript1.js"></script>
<script src="/js/myScript1.js"></script>
JavaScript 能够以不同方式“显示”数据：
如需访问 HTML 元素，JavaScript 可使用 document.getElementById(id) 方法。
id 属性定义 HTML 元素。innerHTML 属性定义 HTML 内容：
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>
显示结果：
我的第一个段落。
11
在 HTML 中，JavaScript 语句是由 web 浏览器“执行”的“指令”。
<script>
var a, b, c;
a = 5;
b = 6;
c = a + b;
document.getElementById("demo1").innerHTML = c;
</script>
JavaScript 语句可以用花括号（{...}）组合在代码块中。
代码块的作用是定义一同执行的语句。
您会在 JavaScript 中看到成块组合在一起的语句：
function myFunction() {
document.getElementById("demo").innerHTML = "I am readming";
document.getElementById("myDIV").innerHTML = "www.yuanscn.com";
}
JavaScript 语句常常通过某个关键词来标识需要执行的 JavaScript 动作。
下面的表格列出了一部分将在教程中学到的关键词：
| 关键词 | 描述 |
|---|---|
| break | 终止 switch 或循环。 |
| continue | 跳出循环并在顶端开始。 |
| debugger | 停止执行 JavaScript，并调用调试函数（如果可用）。 |
| do ... while | 执行语句块，并在条件为真时重复代码块。 |
| for | 标记需被执行的语句块，只要条件为真。 |
| function | 声明函数。 |
| if ... else | 标记需被执行的语句块，根据某个条件。 |
| return | 退出函数。 |
| switch | 标记需被执行的语句块，根据不同的情况。 |
| try ... catch | 对语句块实现错误处理。 |
| var | 声明变量。 |
注释：JavaScript 关键词指的是保留的单词。保留词无法用作变量名。
var x, y; // 声明变量
x = 7; y = 8; // 赋值
z = x + y; // 计算值
双斜杠 // 或 /* 与 */ 之间的代码被视为注释。
注释会被忽略，不会被执行
| 运算符 | 描述 |
|---|---|
| + | 加法 |
| - | 减法 |
| * | 乘法 |
| / | 除法 |
| % | 系数 |
| ++ | 递加 |
| -- |
递减 |
| 运算符 | 描述 |
|---|---|
| == | 等于 |
| === | 等值等型 |
| != | 不相等 |
| !== | 不等值或不等型 |
| > | 大于 |
| < | 小于 |
| >= | 大于或等于 |
| <= | 小于或等于 |
| ? | 三元运算符 |
注释：JS 比较这一章中完整描述了比较运算符。
| 运算符 | 描述 |
|---|---|
| && | 逻辑与 |
| || | 逻辑或 |
| ! | 逻辑非 |
JavaScript 变量能够保存多种数据类型：数值、字符串值、数组、对象等等：
var length = 7; // 数字 var lastName = "Gates"; // 字符串 var cars = ["Porsche", "Volvo", "BMW"]; // 数组 var x = {firstName:"Bill", lastName:"Gates"}; // 对象
在真实生活中，汽车是一个对象。
汽车有诸如车重和颜色等属性，也有诸如启动和停止的方法：
下面是一些常见的 HTML 事件：
| 事件 | 描述 |
|---|---|
| onchange | HTML 元素已被改变 |
| onclick | 用户点击了 HTML 元素 |
| onmouseover | 用户把鼠标移动到 HTML 元素上 |
| onmouseout | 用户把鼠标移开 HTML 元素 |
| onkeydown | 用户按下键盘按键 |
| onload | 浏览器已经完成页面加载 |
事件处理程序可用于处理、验证用户输入、用户动作和浏览器动作：
让 JavaScript 处理事件的不同方法有很多：
原文：https://www.cnblogs.com/yuanscn/p/11121680.html