二、JS 的基本使用
2.1 JS 的书写位置
JS 的书写位置有三种,分别是行内式、内嵌式和外部引入
2.1.1 行内式
- 可以将单行或少量 JS 代码写在HTML标签的事件属性中(以 on 开头的属性),如:onclick
- 注意单双引号的使用:在HTML中我们推荐使用双引号, JS 中我们推荐使用单引号
- 可读性差, 在html中编写JS大量代码时,不方便阅读;
- 引号易错,引号多层嵌套匹配时,非常容易弄混;
- 仅在特殊情况下使用
示例
<input type="button" value="点我试试" onclick="alert('Hello World')" />
2.1.2 内嵌式
一般将js代码写在 body 标签所有页面内容的后面
<body>
<div>
页面内容
</div>
<script>
alert('Hello World~!');
</script>
</body>
2.1.3 外部引用
- 利于HTML页面代码结构化,把大段 JS代码独立到 HTML 页面之外,既美观,也方便文件级别的复用
- 引用外部 JS文件的 script 标签中间不可以写代码,写了代码也不会生效
- 适合于JS 代码量比较大的情况
- 一般将js代码写在 body 标签所有页面内容的后面
- js 代码按书写的先后顺序执行
示例
<body>
<div>
页面内容
</div>
<script src='index.js'> </script>
</body>
2.2 <noscript>
元素
<noscript>
是在浏览器不支持或者禁用JS时显示的内容,写在<body>
标签内,在浏览器支持JS的情况下不会显示
2.3 JavaScript 注释
//单行注释
/*
多行注释
*/
快捷键:单行注释:Ctrl+/,多行注释:Ctrl+Shift+/
2.4 JavaScript 输入输出语句(调试语句)
方法 | 说明 |
---|---|
alert(message) | 弹出窗口,但主要用给用户展示的内容 |
console.log(message) | 在控制台打印常规消息 |
console.info(message) | 在控制台打印信息性内容 |
console.error(message) | 在控制台打印错误消息 |
console.warn(message) | 在控制台打印警告消息 |
示例
console.log('常规消息');
console.info('信息性内容')
console.error('错误消息');
console.warn('警告消息');