变量-事件-CSDN博客

本文链接：https://blog.csdn.net/2302_76953773/article/details/130207006

变量

变量的定义：

变量就是存储值的一个容器

变量的命名规则：

变量名必须是字母、下划线、$开头

变量名必须是字母、下划线、$、数字组成

遵循驼峰命名法

要有语义化

不能使用关键字个保留字

var a = 10 
var _a = 20
var $a = 30 
var num2 = 90
console.log(a, _a, $a);

// 驼峰命名 -- 变量名由两个单词或者两个以上的单词构成，从第二个单词开始，首字母要大写
// 语义化
var userName = 'zahngsan'
var passWord = '123456'; 
console.log(userName, passWord);

// 不能使用关键字和保留字(现在不是关键字 将来会成为关键字的字)
var var = 90  // 错误 
var id = 80 // id是关键字 
var class = 100 // class是保留字

变量使用的注意事项：

1、变量声明必须使用var关键字

没有使用var关键字，是一个全局变量（在任何位置都可以使用）

注意：虽然是可以使用的，但是是不符合程序的设计标注的

不管这个变量参不参与计算，都会占用内存，会造成内存浪费，严重的会造成内存溢出

a = 10;

console.log(a);

2、变量必须先声明后使用

console.log(a * 2); // undefined 没有值 --- NaN

var a = 10;

3.变量名不能重复

后面的会覆盖前面的，导致值丢失

var a = 10;

var a = 20;

console.log(a); // 20

4、变量的声明方式

一次性声明一个变量并赋值

一次性声明多个变量，并同时赋值，每个变量之间使用逗号隔开一次性声明多个变量，并分开赋值

// - 一次性声明一个变量并赋值
var a = 10;
// - 一次性声明多个变量，并同时赋值，每个变量之间使用逗号隔开
var a = 10, b = 20, c= 30;
// - 一次性声明多个变量，并分开赋值
var num1, num2,num3;
num1 = 90
num2 = 100;
num3 = 200

事件

js是我们有能力创建动态得内容，但是，事件是可以被js侦测到得行为

简单理解：鼠标点击 -- 触发事件得相应机制

事件三要素：

1.事件源（哪个元素）-- 发生事件得元素 ---- 程序员人为定义得

2.事件类型（什么事件）-- 比如鼠标单击事件

3.事件得处理程序（绑定事件得元素做了什么事） -- 也就是事件被出发后，元素发生得行为

// 元素：html标签
// onclick:鼠标得左键 单击事件
// function(){}: 元素被单击，事件被触发后得执行动作的函数
元素.onclick = function(){
// 元素的动作代码
}

<body>
<button>按钮</button>
<script>
/*  需求：页面中有一个按钮，点击这个按钮，打印出：被刺了
1、页面  -- html
2、添加按钮 -- button
3、给按钮添加一个事件 -- 元素.onclick = function(){}
4、确定是单击事件 -- 事件名称 (onclick)
5、打印 -- console.log('被刺了 ') */

//  获取元素
var btn = document.querySelector('button')
// 添加事件
btn.onclick = function (){
// 做什么事
console.log('背刺了');
}
</script>
</body>

其他事件

onclick 点击事件
onmouseover 鼠标的经过（支持冒泡）
onmouseout 鼠标离开（支持冒泡）
onmouseenter 鼠标的经过（不支持冒泡）
onmouseleave 鼠标离开（不支持冒泡）

onmousedown 鼠标的按下
onmouseup 鼠标的抬起
onmousemove 鼠标的移动

oncontextmenu 右键