js
js
全栈开发
全栈开发工程师,互联网教育特约讲师
展开
-
js专栏 01.js简介 01.js注释
# 01.js注释 [toc]{type: "ol", level: [3]} ### js注释 - 单行注释 ```js // 单行注释 ``` - 多行注释 ```js /* 多行 注释 */ ``` - 结束标记 ```js // js以 ; 为结束标记 ```原创 2022-03-15 18:50:09 · 62 阅读 · 0 评论 -
js专栏 01.js简介 02.变量与常量
# 02.变量与常量 [toc]{type: "ol", level: [3,4]} ### 定义变量|常量 #### 变量 - ES5及之前的语法 > **var**{style="color:goldenrod"} name = 'lili'; - ES6推出的新语法 > **let**{style="color:green"} name = 'lili'; #### 常量 > 在js中,有真正意义上的常量 > const pi = 3.14; ### 命名规范 ...原创 2022-03-15 19:03:44 · 53 阅读 · 0 评论 -
js专栏 02.基础语法 01.运算符
# 01.运算符 [toc]{type: "ol", level: [3]} ### 算数运算符 - \+ - \- - \* - / - % - ++ > 先赋值,后自增 ```js let res1 = x++; ``` - \-- > 先自减,后赋值 ```js let res2 = --x; ``` ### 赋值运算符 - = - += - -= - *= - /= - %= ### 比较运算符 - == > 1 == '1' 弱等于 > 内部做类型转换...原创 2022-03-15 19:07:12 · 50 阅读 · 0 评论 -
js专栏 02.基础语法 02.流程控制
# 02.流程控制 [toc]{type: "ol", level: [3]} ### if条件语句 ```js let age = 20; if(age > 18) { console.log(age); }else if(age<18) { console.log('未成年'); } else { console.log('18'); } ``` ### switch条件语句 ```js let num = 1; switch (num) { c...原创 2022-03-15 19:10:27 · 47 阅读 · 0 评论 -
js专栏 02.基础语法 03.函数
# 03.函数 [toc]{type: "ol", level: [3]} ### 无参函数 ```js function f1() { console.log('无参函数') } f1(); ``` ### 有参函数 > 实参多传,取够为止; > 实参少传,undefined补位 ```js function f2(x,y) { // 获取函数接收到的所有参数 console.log(arguments); console.log(x,y); ...原创 2022-03-15 19:13:43 · 58 阅读 · 0 评论 -
js专栏 03.数据类型 01.数值类型
# 01.数值类型 [toc]{type: "ol", level: [3]} ### 查看数据类型 ```js let a = 11; let b = 11.11; console.log(typeof a); console.log(typeof b); ``` > number number ### 数据类型转换 > 如果传入的字符串的开头不是数字,会提示:NaN > **NaN**{style="color:red"}: **Not a Number**{sty...原创 2022-03-15 19:15:33 · 47 阅读 · 0 评论 -
js专栏 03.数据类型 02.字符类型
# 02.字符类型 [toc]{type: "ol", level: [3,4]} #### 定义单行字符串 ```js let s1 = 'lili'; ``` #### 定义多行字符串 ```js let s2 = ` hello world ... ` ``` #### 模版字符串 > 在js中推荐直接使用 + 做拼接 ```js let name = 'lili' + 'kitty' let age = 18 let s3 = ` my name ...原创 2022-03-15 19:18:01 · 49 阅读 · 0 评论 -
js专栏 03数据类型 03.布尔类型
# 03.布尔类型 [toc]{type: "ol", level: [3]} ### 布尔类型 > js中的布尔值为全小写:true false - false > 空字符串 0 null NaN undefined - null > 值为空 - NaN > Not a Number 不是数值 - null > 清除变量值时使用 name = null; - undefined > 声明了一个变量,但是没有做初始化操作 > 函数没有返回值时...原创 2022-03-15 19:19:21 · 49 阅读 · 0 评论 -
js专栏 03.数据类型 04.数组类型
# 04.数组类型 [toc]{type: "ol", level: [4]} #### 定义数组 ```js let l = [11,22,'apple',['hello',13.14]]; let l1 = [12,24,48,96,36,72,27]; ``` #### 统计数组长度 ```js l.length; ``` #### 添加元素到头部 ```js l.unshift(8); ``` #### 弹出头部元素 > 删除头部元素并返回 ```js l.shift...原创 2022-03-15 19:21:14 · 43 阅读 · 0 评论 -
js专栏 03.数据类型 05.自定义类型
# 05.自定义类型 [toc]{type: "ol", level: [3]} ### 自定义对象 - 方式1 ```js let d = {'name':'lili', 'age':18, 'height':175}; ``` - 方式2 ```js let d_new = new Object('') d_new.name = 'han' d_new.age = 32 ``` ### 对象取值 ```js let d_name = d['name']; let d_age = d....原创 2022-03-15 19:22:30 · 246 阅读 · 0 评论 -
js专栏 04.内置对象 01.日期对象
# 01.日期对象 [toc]{type: "ol", level: [3]} ### 创建对象 ```js let d = new Date(); console.log(d); ``` > Tue Sep 07 2021 12:38:55 GMT+0800 (中国标准时间) ### 格式转换 ```js console.log(d.toLocaleString()); ``` > 2021/9/7 下午12:38:55 ### 获取月份 ```js d.getMonth...原创 2022-03-15 19:23:48 · 44 阅读 · 0 评论 -
js专栏 04.内置对象 02.json对象
# 02.json对象 [toc]{type: "ol", level: [3]} ### 自定义对象 ```js let d = {'name':'bai','age':18,'height':175}; ``` ### 序列化 ```js res_dumps = JSON.stringify(d); console.log(res_dumps); ``` > \{"name":"bai","age":18,"height":175} ### 反序列化 ```js res_l...原创 2022-03-15 19:25:16 · 66 阅读 · 0 评论 -
js专栏 04.内置对象 03.正则对象
# 03.正则对象 [toc]{type: "ol", level: [3,4]} ### 创建对象 - 方式1 > 什么都不传,默认传入undefined ```js let r1 = new RegExp('^[a-zA-Z]'); r1.test('Love'); ``` > true - 方式2 ```js let r2 = /^[a-zA-Z]/; r2.test('Apple'); ``` > true ### 正则匹配 ```js let s = 'love ...原创 2022-03-15 19:27:33 · 45 阅读 · 0 评论 -
js专栏 05.BOM 01.BOM对象
# 01.BOM对象 [toc]{type: "ol", level: [4]} #### 概念 - Browser Object Model > 浏览器对象模型 > 通过js代码操作浏览器 #### 浏览器高度 ```js window.innerHeight; ``` #### 浏览器宽度 ```js window.innerWidth; ``` #### 弹出新窗口 > 可设定网址、位置及尺寸 ```js window.open('https://www.ba...原创 2022-03-15 19:32:24 · 48 阅读 · 0 评论 -
js专栏 05.BOM 02.windows子对象
# windows子对象 [toc]{type: "ol", level: [3,4]} ### 浏览器对象 #### 浏览器名称 ```js window.navigator.appName; ``` #### 浏览器版本 ```js window.navigator.appVersion; ``` #### 浏览器校验 > 校验当前请求的发起者是否为浏览器 ```js window.navigator.userAgent; ``` #### 操作系统 > 当前浏览器所处...原创 2022-03-15 19:33:49 · 53 阅读 · 0 评论 -
js专栏 05.BOM 03.弹出框与计时器
# 03.弹出框与计时器 [toc]{type: "ol", level: [3,4]} ### 弹出框 #### 警告框 ```js alert('注意个人财产安全'); ``` ![弹出框与计时器-弹出框-警告框](03.弹出框与计时器-弹出框-警告框.png) #### 确认框 ```js confirm('确定要这样做?'); ``` ![弹出框与计时器-弹出框-确认框](03.弹出框与计时器-弹出框-确认框.png) #### 提示框 > 可设置默认值 ```js p...原创 2022-03-16 19:24:08 · 88 阅读 · 0 评论 -
js专栏 06.DOM 01.标签查找
# 01.标签查找 [toc]{type: "ol", level: [3,4]} ### 概念 - DOM:Document Object Model > 文档对象模型 > 通过js代码操作标签 - 每个分支都是一个节点 > html --> head body > head --> title ... > body --> a h p span div ... ### html结构 ```html <di...原创 2022-03-16 19:31:19 · 125 阅读 · 0 评论 -
js专栏 06.DOM 02.节点操作
# 02.节点操作 [toc]{type: "ol", level: [3,4]} ### 基础结构 ```html <div id="d1" class="c1 bg_green bg_gold"> <p id="p1" style="text-align: center">I love Apple. It's a good idea. I think so.</p> <span></span> </div>...原创 2022-03-16 19:33:07 · 53 阅读 · 0 评论 -
js专栏 07.事件
# 07.事件 [toc]{type: "ol", level: [3]} ### 事件 > 到达某个条件自动触发的动作 - html结构 ```html <button onclick="f1()">点我</button> <button id="d1">点我</button> ``` - 方式1 ```js function f1() { alert('方式1') } ``` - 方式2 ```js let btnEle = doc...原创 2022-03-16 19:34:11 · 42 阅读 · 0 评论