1、JavaScript 用法
HTML 中的脚本必须位于 <script> 与 </script> 标签之间。
脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。
1.1、<script> 标签
- 如需在 HTML 页面中插入 JavaScript,请使用 <script> 标签。
- <script> 和 </script> 会告诉 JavaScript 在何处开始和结束。
- <script> 和 </script> 之间的代码行包含了 JavaScript:
1.2、在 <head> 或者 <body> 的JavaScript
- 可以在 HTML 文档中放入不限数量的脚本。
- 脚本可位于 HTML 的 <body> 或 <head> 部分中,或者同时存在于两个部分中。
- 为了语言规范通常的做法是把函数放入 <head> 部分中,或者放在页面底部。这样就可以把它们安置到同一处位置,不会干扰页面的内容。
1.3、外部引用
- 通过script标签的src属性,引入外部的js文件。
- 外部 javascript 文件不使用 <script> 标签,直接写 javascript 代码。
2、JavaScript 变量
与代数一样,JavaScript 变量可用于存放值(比如 x=5)和表达式(比如 z=x+y)。
变量可以使用短名称(比如 x 和 y),也可以使用描述性更好的名称(比如 age, sum, totalvolume)。
- 变量必须以字母开头
- 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做)
- 变量名称对大小写敏感(y 和 Y 是不同的变量)
声明(创建) JavaScript 变量
-
在 JavaScript 中创建变量通常称为"声明"变量。
-
我们使用 var 关键词来声明变量:
-
var carname;
-
变量声明之后,该变量是空的(它没有值)。
-
如需向变量赋值,使用等号:
-
例如:定义变量x,把1赋值给x
-
一条语句,多个变量,可以在一条语句中声明很多变量。该语句以 var 开头,并使用逗号分隔变量即可: var user, admin;
-
也可以之直接定义赋值:var age=20,year=2020;
<script>
var x ;
x=1;
</script>
变量赋值后,也可以重新赋值,新的值会占据变量空间。
一个现实生活的类比
如果将变量想象成一个“数据”的盒子,盒子上有一个唯一的标注盒子名字的贴纸。这样我们能更轻松地掌握“变量”的概念。
例如,变量 message
可以被想象成一个标有 "message"
的盒子,在盒子里面,有一个值为 "Hello!"
。
我们可以在盒子内放入任何值。
同样,我们也可以改变它。值可以根据需要多次改变。
let message;
message = 'Hello!';
message = 'World!'; // 值改变了
alert(message);
当值改变的时候,先前的数据就从变量中删除了。
let hello = 'Hello world!';
let message;
// 将字符串 'Hello world' 从变量 hello 拷贝进 message
message = hello;
// 现在两个变量保存着相同的数据
alert(hello); // Hello world!
alert(message); // Hello world!
3、JavaScript 输出
JavaScript 可以通过不同的方式来输出数据:
- 使用 alert() 弹出警告框。
-
<script> var x; x = 1; alert(x); </script>
- 使用 document.write() 方法将内容写到 HTML 文档中。
<script>
var text = "我是一个文本";
document.write(text);
</script>
使用 innerHTML 写入到 HTML 元素。
使用 console.log() 写入到浏览器的控制台。
<script>
var x;
x = 1;
console.log(x);
</script>