JavaScript笔记

chenyq234

已于 2022-06-14 02:49:18 修改

阅读量129

点赞数

文章标签： javascript 前端开发语言

于 2022-06-14 01:58:56 首次发布

本文链接：https://blog.csdn.net/weixin_39422137/article/details/125270449

版权

一、JavaScript基础语法

1.JavaScript引入方式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <!--script标签内，写Javascript代码-->
    <!--<script>-->
        <!--alert('hello,world');-->
    <!--</script>-->

    <!--外部引入-->
    <!--注意：script标签必须成对出现-->
    <script src="js/qj.js"></script>

    <!--不用显示定义type，也默认就是 javascript-->
    <script type="text/javascript">

    </script>


</head>
<body>


<!--这里也可以存放-->
</body>
</html>

2. 输出

2.1 弹出窗口输出

alert("Hello,World!");

2.2 向控制台输出：

console.log("输出一条日志");
console.info("输出一条信息");
console.warn("输出一条警告");
console.error("输出一条错误");

3. 变量

3.1 声明变量

var a = 123;

4.数据类型

4.1 类型分类

JavaScript中一共有6种数据类型：
String
Number
Boolean
Undefined
Null
Object 除以上5中之外的类型都称为Object

4.2 检查变量数据类型-typeof

typeof 数据
console.log(typeof 123);
alert(typeof "ddddd")

5.运算符

5.1比较运算符

== 用来做相等运算如果值的类型不同，将其转换为相同的类型，然后再比较
=== 用来做全等运算不会做自动的类型转换，如果两个值的类型不同，直接返回false

6.条件语句

6.1 if…else条件语句：

var number = 80;
if (number >= 80) {
    console.log("优秀");
} else if (number >= 60) {
    console.log("及格");
} else {
    console.log("不及格")
}

6.2 switch…case条件语句：

switch (语句) {
    case 表达式1:
        语句...
        break;
    case 表达式2:
        语句...
        break;
    default:
        语句...
        break;
}

7.循环语句

while
do while
for

8.对象

pass

二、JavaScript DOM

HTML DOM 是关于如何获取、更改、添加或删除 HTML 元素的标准

1.查找 HTML 元素

document.getElementById(id)	//通过元素 id 来查找元素。
document.getElementsByTagName(name)	//通过标签名来查找元素。
document.getElementsByClassName(name)	//通过类名来查找元素。
document.querySelector(CSS选择器)	//通过CSS选择器选择一个元素。
document.querySelectorAll(CSS选择器)	//通过CSS选择器选择多个元素。

2.获取 HTML 的值

元素节点.innerText	//获取 HTML 元素的 inner Text。
元素节点.innerHTML	//获取 HTML 元素的 inner HTML。
元素节点.属性	        //获取 HTML 元素的属性值。
元素节点.getAttribute(attribute)	//获取 HTML 元素的属性值。
元素节点.style.样式	//获取 HTML 元素的行内样式值。