JS基础

1.<script></script>标签包裹JS代码，一般放在body后面（放在前面浏览器会比较靠前的加载JS代码从而导致报错《未找到该元素啥的》）

一、定义变量

1.var a ；
变量的类型：
1.数值类型 0、1、2、3、4、5、6、7、8、9

var a = 123;

2.字符串类型(用单引号或者双引号包裹，字符串的类型可以是任意字符)

var b = "你好"

3.布尔类型 true 真 false 假

var d = true;
var e = false;

4.null（属于对象类型）空类型

f = null

5.undefind

var g;

二、定义变量

变量 -》用来存储数据的容器变量被保存在内存里面
变量是有要求的
1.变量名必须是字母、数字、下划线、$组成数字不能开头
不能是关键字、保留字
区分大小写
规范：驼峰命名法

如何查看关键字

console.log(a);

类型转换（数值类型、字符串类型、布尔类型的相互转换）

1.转数值类型 Number（’‘）

      console.log(Number("123"));
     console.log(Number("00123"));
     console.log(Number(true));
     console.log(Number(false));
      console.log(Number(null));
     console.log(Number(undefined));

2.转化成字符串

                 console.log(String(123));
     console.log(String(0));
     console.log(String(true));
     console.log(String(false));
     console.log(String(undefined));
     console.log(String(null));

3.转布尔类型

      console.log(Boolean("0"));
     console.log(Boolean("1"));
     console.log(Boolean("true"));
     console.log(Boolean(""));
     console.log(Boolean("-5"));
     // 字符串转布尔 非空为真
     console.log(Boolean(null)); 
     console.log(Boolean(undefined));
     // undefined和null 是false
     console.log(Boolean(0));
     console.log(Boolean(4));
     console.log(Boolean(-400));
      // 数字转布尔 非零为真

获取值改变值

1.获取值可以通过id名类名等找到具体的元素
然后我们用一个变量来存储他，或者直接改变样式

document.getElementById("uName").value

通过ID名来找到ID名为“uName”的元素点就代表的他的value值

document.getElementById("uName").value = "老铁双击666";
等号就代表赋值

改变div（标签）的内容可以使用innerHTML属性

在JS中改变HTMl内容
innerHTML 可以是标签并且可以被解析
document.getElementById("first").innerHTML="<h1>扎心了，老铁</h1>";
字符串拼接操作 + 对字符串的作用就是拼接
console.log("123"+"asd"+"你好"+"a" +" ");

输出的三种方式检查程序非常有用

输出主要为了检查程序里面的某个值，以此来调试程序。
console.log('这是控制台打印');
alert('这是弹框消息');
document.write('这是文档写入');

JS运算符

分为五大类
1.赋值运算符 =
等号不是数学里面的相等，而是把等号有点的赋值给等号左边（优先级最低）
2.算术运算符

- - / % ++ --
    a++ 和 ++a 都是让a 在原来的基础上加一，区别是++a是先自加然后在参与别的运算，a++是先参与相关的运算在自加
    3.关系运算符（比较）

< >= <= == != === !==
三个等号、不等等代表数值和类型都要判断
4.逻辑运算符
&& 逻辑与两个条件同时满足为真
|| 逻辑或两个条件满足一个为真
！非真就变假假就变真
5.条件运算符
条件表达式？表达式1 ：表达式2 如果条件表达式为真整个结果就是表达式1 反之表达式2

运算符的优先级

算数运算符大于关系运算符大于逻辑运算符大于赋值运算符

短路与短路或

在逻辑与里面如果第一个条件为false 那么第二个条件就不会执行
在逻辑或里面如果第一个条件为真就可以判定整个表达式为真此时第二者表达式就不会执行
短路与一假具假短路或一真具真

获取元素

通过getElements获取到的是一组数据会放在数组里面
通过标签获取元素

document.getElementByTagName
通过Name属性获取元素
document.getElementsByName
通过类名获取元素
document.getElementsByClassName