wg_iGBFcBFB的博客_js 基础

js-插件封装-树形折叠菜单

(function () { // 插件核心:OOP的模式，可以创建单独的实例，这样实现私有属性和公有方法的有效管理 class zTree { constructor(element, options) { // init params let self = this, len = argumen

html

ico

私有属性

原创 2021-08-07 09:37:56 306 阅读

弹窗插件封装 js插件封装-弹窗组件封装-类型判断-发布订阅

https://gitee.com/eric167/js <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <met

拖拽

html

javascript

css

自定义按钮

原创 2021-08-07 09:37:39 216 阅读

slice() 和 splice() 使用方法和区别

// var arr = ["Eric",'Lilei','Jok',"Ela"]; /** * slice() * 可以用来从数组提取指定元素 * 不会改变原数组而是将截取到的元素封装到一个新数组中返回 * --参数 * 1. 截取开始的位置包含开始索引 * 2. 截取结束的位置不包含开始索

其他

原创 2021-07-28 15:38:21 204 阅读

数组去重 concat() 连接两个或多个数组 join() 将数组转换为字符串 reverse() 反转数组 sort() 排序

// var arr2 = [1,2,3,2,2,1,3,4,2,5]; // // 数组去重 // for(var i=0;i<arr2.length;i++){ // // console.log(arr2[i]); // // 获取当前元素后的元素 // for(var j=i+1;j<arr

其他

原创 2021-07-28 15:38:03 244 阅读

call() 和 apply() -this的情况

function fun(a,b){ console.log("a = "+ a); console.log("b = "+ b); alert(this); } var obj= { name:"obj", sayName:function(){ alert(this.name); } }; /*

其他

原创 2021-07-28 15:37:51 78 阅读

Date 对象

/** * Date 对象 */ var d = new Date(); // 指定时间对象 // 日期格式月份/日/年时:分:秒 var d2 = new Date("12/03/2016 11:10:30"); // getDate() 获取当前是几号 var day = d.getDat

其他

原创 2021-07-28 15:37:24 88 阅读

arguments

/** * 在调用函数时，浏览器每次都会传递连个隐含的参数 * 1 函数的上下文对象 this * 2 封装实参的对象 arguments * -arguments 是一个类数组对象, 也可以通过索引来操作数据也可以获取长度 * 在调用函数时，所传递的实参都会封装到arguments 中保存

其他

原创 2021-07-28 15:37:10 127 阅读

Math / 随机数生成

/** * Math * * Math.PI 表示圆周率 */ // console.log(Math); // console.log(Math.PI); // Math.ceil() 向上取整 // console.log(Math.ceil(1.1));//2 // Math.floor()

其他

原创 2021-07-28 15:36:57 581 阅读

正则匹配去掉字符串左右空格

// str = " hello " /** * 去除掉字符串中的空格 * 使用 "" 来替换空格 * */ // console.log(str) // 去除开头的空格 // str = str.replace(/^\s*/,"") //console.log(str) // 去除结尾的空

其他

原创 2021-07-28 15:36:39 1133 阅读

其他

原创 2021-07-28 15:36:29 110 阅读

正则表达式

/** * 正则表达式 */ // 创建正则表达式的对象 /** * 语法 * var 变量 = new RegExp("正则表达式","匹配模式") * var reg = new RegExp("a"); 检查字符串是否含有 a * 在构造函数中可以传递一个匹配模式作为第二个参数 *

其他

原创 2021-07-28 15:36:16 70 阅读

DOM 获取标签获取body 标签获取html根标签 querySelector querySelectorAll

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

DOM

原创 2021-07-28 15:36:14 1416 阅读

DOM 获取标签获取body 标签获取html根标签 querySelector querySelectorAll

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

13522679763

原创 2021-07-28 15:35:57 1708 阅读

全选，反选练习

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

全选反选练习

原创 2021-07-28 15:35:22 266 阅读

节点的添加替换删除

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

删除

原创 2021-07-28 15:35:05 497 阅读

表格添加 DOM 练习

未优化 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content

DOM 练习

原创 2021-07-28 15:34:47 112 阅读

其它样式获取 clientWidth clientHeight offsetWidth offsetHeight offsetParent offsetLeft offsetTop scrollHeight scrollWidth

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

clientWidth

原创 2021-07-28 15:34:22 151 阅读

js 设置和获取 div 样式

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

js

原创 2021-07-28 15:34:03 741 阅读

event = event || window.event; 兼容各个浏览器

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

event

原创 2021-07-28 15:33:46 206 阅读

js 事件绑定和兼容 addEventListener attachEvent

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

js

原创 2021-07-28 15:33:29 136 阅读

滚动到底部才可以注册勾选协议练习

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

滚动到底部

原创 2021-07-28 15:33:10 471 阅读

div 跟随鼠标进行移动兼容

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

div

原创 2021-07-28 15:32:47 152 阅读

事件冒泡和取消冒泡

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

事件冒泡

原创 2021-07-28 15:32:30 209 阅读

拖拽功能实现

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

拖拽功能实现

原创 2021-07-28 15:32:10 409 阅读

鼠标滚轮事件

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

鼠标滚轮事件

原创 2021-07-28 15:31:44 597 阅读

键盘按键事件

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

键盘按键

原创 2021-07-28 15:31:22 819 阅读

Navigator 判读浏览器信息类型

/** * Navigator * 代表当前浏览器的信息通过该对象可以来识别不同的浏览器 * 一般只会使用 userAgent 来判断浏览器的信息 * * userAgent * Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.

Navigator

原创 2021-07-28 15:30:59 176 阅读

BOM 浏览器对象 Location History

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

BOM

原创 2021-07-28 15:30:42 111 阅读

定时器动画的应用

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

定时器动画

原创 2021-07-28 15:30:02 135 阅读

轮播图实现

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi

数据类型

原创 2021-07-28 15:29:40 228 阅读

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯

51CTO博客

13522679763-Eric-任国强

js-插件封装-树形折叠菜单

弹窗插件封装 js插件封装-弹窗组件封装-类型判断-发布订阅

slice() 和 splice() 使用方法和区别

数组去重 concat() 连接两个或多个数组 join() 将数组转换为字符串 reverse() 反转数组 sort() 排序

call() 和 apply() -this的情况

Date 对象

arguments

Math / 随机数生成

正则匹配去掉字符串左右空格

字符串相关方法

正则表达式

DOM 获取标签获取body 标签获取html根标签 querySelector querySelectorAll

DOM 获取标签获取body 标签获取html根标签 querySelector querySelectorAll

全选，反选练习

节点的添加替换删除

表格添加 DOM 练习

其它样式获取 clientWidth clientHeight offsetWidth offsetHeight offsetParent offsetLeft offsetTop scrollHeight scrollWidth

js 设置和获取 div 样式

event = event || window.event; 兼容各个浏览器

js 事件绑定和兼容 addEventListener attachEvent

滚动到底部才可以注册勾选协议练习

div 跟随鼠标进行移动兼容

事件冒泡和取消冒泡

拖拽功能实现

鼠标滚轮事件

键盘按键事件

Navigator 判读浏览器信息类型

BOM 浏览器对象 Location History

定时器动画的应用

轮播图实现