一、JavaScript简介
1. 什么是JavaScript
JavaScript简称为JS,由网景公司开发的客户端脚本语言,不需要编译,可以直接运行
Web前端三层:
- 结构层 HTML 定义页面的结构
- 样式层 CSS 定义页面的样式
- 行为层 JavaScript 用来实现交互,提升用户体验
2. JavaScript的作用
- 在客户端动态的操作页面
- 在客户端做数据的校验
- 在客户端发送异步请求
二、引用方式
1. 内联方式
在页面中使用script标签,在script标签的标签体中编写js代码
script标签可以放在页面的任意位置,一般放在head中
<script type="text/javascript">
js代码
</script>
2. 行内方式
在普通标签中编写js代码,一般需要结合事件属性,如onclick、onmouseover等
<input type="button" value="点我" onclick="alert('Hello')"/>
<!--使用超链接的href属性执行js时,必须添加javascript前缀-->
<a href="javascript:alert('World')">我是超链接</a>
3. 外部方式
使用单独的 .js
文件定义,然后在页面中使用script标签引入外部脚本文件
<script type="text/javascript" src="js文件的路径"></script>
注:如果某个script标签用于引入外部js文件,则该script标签的标签体中不能再写js代码
.js
文件:
alert("哈哈");
.html
文件:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JS的引用方式</title>
<style>
div{
width: 100px;
height: 100px;
background: #ccc;
}
</style>
<!--1.内嵌方式-->
<script>
alert("Hello JavaScript"); //弹出一个窗口
</script>
<!--3.引用外部的js文件-->
<script src="js/hello.js"></script