JS引入方式
1 行间引入
<!-- 第一种 行间引入 将js的语法直接写在开始标签上
注意:双引号不能嵌套双引号 单引号也不能嵌套单引号 但是双引号和单引号可以相互嵌套
onclick 鼠标点击事件
alert("提示信息") 浏览器弹窗
缺点:结构行为不分离 不方便后期维护
-->
<button onclick="alert('今天周一')">提交</button>
2 内部引入
<!--
第二种 内部引入
js代码放在script标签中 script标签可以放在任意位置 代码的执行顺序是从上往下执行
建议:一般放在head和body的末尾 是因为js一般都是操作标签 我们要确保标签先加载出来
缺点:结构行为不分离
-->
<script>
//浏览器弹窗
alert("弹走弹走6")
//操作div标签 操作p标签
</script>
3 外部引入
<!-- 第三种 外部引入
在外部创建js文件 通过script标签的src属性引入文件 src="js文件路径"
注意:引入外部文件的script标签 里面不能再写其他的js脚本
-->
<script src="./1.js">
// alert("没有弹走") 不要在这里面再写其他的js代码
</script>
<script>
alert("没有弹走")
</script>
语法规则与注释
<body>
<!-- 注释
单行注释 // 一行js代码 快捷键是ctrl+/
多行注释 /* 多行js代码 */ 快捷键是ctrl+shift+/
-->
<!-- js的语法
1-每行语句后面要加;
2-js中严格区分大小写,有时候会使用驼峰命名 fontSize
-->
<script>
/* */
//
alerT("123");
</script>
</body>
JavaScript的调试语句
js调试:在实际开发过程中用于检测代码的功能的一种方式
1.alert()
- 语法: alert(提示信息)
- 作用: 在页面中弹出警告框,用于提示
- 缺点: 阻塞性的弹窗 一次只能输出一个
<script>
alert("提示信息");
alert("你在说什么");
console.log("123")
</script>
2. console.log()
- 语法:console.log(输出信息)
- 作用:在控制台打印信息 多个输出之间用逗号隔开
<script>
//2.console.log()
console.log("中午吃啥");
console.log("米饭","泡面","西北风");
</script>
3. 打断点
- 在sources找到当前运行的文件---在打断点的代码行号上点击
3 变量
- 概念:存储数据的容器 称作变量(标识符) 给存储数据的区域起个名字
- 语法:var 变量名 = 值
- 基础用法
<script>
// 1.声明变量--基础用法
var a;
console.log(a);//undefined 未定义 声明了变量但是没有赋值
//2 赋值 读法:将右侧数据123赋值给左边的变量a
a = "123";
console.log(a);//123
//3.声明变量和赋值同时进行
var b = "456";
//4.同时声明多个变量 逗号意味着这行代码没有结束
var c = "泡面", d = "赵四";
console.log(c, d)//泡面 赵四
//5.连等写法 x y的值都是”789
var x = y = "789";
console.log(x, y);// 789 789
</script>
特殊用法
//6.特殊用法 不建议使用
t = "10";//全局变量
console.log(t);//10
console.log(a1);//a1 is not defined 没有声明没有赋值
var a2;
console.log(a2);//undefined 只是声明了变量 但是没有赋值