- 博客(22)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 简单防抖节流
节流 var input=document.querySelector("input"); var ids; input.addEventListener("input",inputHandler); function inputHandler(e){ if(ids) return; ids=setTimeout(function(){ clearTimeo.
2021-12-23 20:27:41
567
原创 练习题选中变大写
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do.
2021-12-23 20:25:27
127
原创 简单图片预加载
var n = 2; var arr = []; function loadImage() { var img = new Image(); img.addEventListener("load", loadHandler); img.src = "./img/" + n + ".jpg"; } function loadHandler(e) { ..
2021-12-23 20:22:12
547
原创 菜单打开关闭
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>...
2021-12-23 12:15:48
202
原创 滑动遮盖导航栏
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.
2021-12-23 12:10:05
87
原创 最简单拖拽01
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.
2021-12-23 12:04:56
63
原创 js垃圾回收机制
为什么产生垃圾?栈,堆里面东西越来越多var a=3 栈中存储的普通变量,不会造成崩溃,浏览器自动清除解决方法垃圾收集器会**定期（周期性）**找出那些不在继续使用的变量，然后释放其内存。但是这个过程不是实时的，因为其开销比较大，所以垃圾回收器会按照固定的时间间隔周期性的执行。在栈中同时大量创建 创建对象,数组 减少栈中变量数量堆中数据有没有被引用 当设为 null 断开引用 数据就会从堆中回收var o={a:1}o=null将栈中变量o 设置为null 表示不在引用对象,
2021-12-17 20:28:18
68
原创 数组的删除splice
数组的删除splicesplice 是删除数组中的某些内容，按照数组的索引来删除splice改变原数组,其返回值构成的新数组是原数组不要的值语法： splice(从哪一个索引位置开始，删除个数，添加的元素(可以多个)) （第三个参数可以不写,也可以替换一个或者多个内容，多个内容使用逗号间隔）第一个参数可以写负数,代表从倒数第几个开始删除若删除0个然后添加,则是在参数1,前面添加,不然是在参数1后面添加// 定义数组var arr = [1, 2, 3, 4, 5, 6]
2021-12-15 19:43:14
5125
原创 Number.isNaN与isNaN的区别?
Number.isNaN与isNaN最大的区别是，Number.isNaN不存在类型转换的行为。console.log(isNaN('测试')) //trueconsole.log(Number.isNaN('测试')) //false上面代码中，都是传入字符串“测试”，但为什么结果不同？原因在于：isNaN会通过Number方法，试图将字符串"测试"转换成Number类型，但转换失败了，因为 Number(‘测试’) 的结果为NaN ，所以最后返回true。而Number.isNaN方法，
2021-12-14 11:59:05
305
原创 js事件委托
当用事件委托的时候，根本就不需要去遍历元素的子节点，只需要给父级元素添加事件就好了，其他的都是在js里面的执行，这样可以大大的减少dom操作，这才是事件委托的精髓所在。适合用事件委托的事件：click，mousedown，mouseup，keydown，keyup，keypress。值得注意的是，mouseover和mouseout虽然也有事件冒泡，但是处理它们的时候需要特别的注意，因为需要经常计算它们的位置，处理起来不太容易。不适合的就有很多了，举个例子，mousemove，每次都要计算它的位
2021-12-02 17:14:23
304
1
原创 为什么typeof null ===object
原理是这样的，不同的对象在底层都表示为二进制，在JavaScript中二进制前三位都为0的话会被判断为对象类型，nul的二进制表示是全0，自然前三位也是0，所以执行类型时会返回“Object”。
2021-12-01 14:26:38
695
原创 元素隐藏?
display:none不占位 opacity:0不占位 visibility:hidden占位 transform:scale(0)占位 position:absolute;z-index:-9999不占位 overflow:hidden不占位
2021-11-10 14:49:29
69
1
原创 解决margin-top传递问题
1给父元素添加边框2添加内边距1,2都会造成盒子变大3 给父元素添加overflow:hieeden4定位.....将父元素触发bfc
2021-11-06 19:06:57
78
1
原创 css定位
定位指的就是将指定的元素摆放在页面的任意位置,通过定位可以任意的摆放元素。 定位指的就是将指定的元素摆放在页面的任意位置，通过定位可以任意的摆放元素.通过position属性来设置元素的定位。可选值: 通过Place属性来设置元素的定位.可选值：static:默认值，元素没有开启定位。relative:开启元素的相对定位。absolute:开启元素的绝对定位。 静态：默认值，元素没有开启定位。亲缘关系：开启元素的相对定位.绝对值：开启元素的绝对定位。fixed:开启元素的固定定位(也是绝对定位
2021-11-04 19:46:43
67
原创 行内元素,块元素,行内块元素特点
行内元素常见的行内元素有：<a>,<strong>,<b>,<em>,<del>,<span> < i > 、< label >、 < br >等行内元素会在一条直线上排列（默认宽度只与内容有关），都是同一行的，水平方向排列。行内元素的特点：和相邻的行内元素在一行上 高度和宽度无效，但是可以设置line-hight 但是水平方向上的padding和margin可以设置，垂直方向上.
2021-11-02 09:27:50
1284
原创 display和visility
display内联元素不可以设置宽高,怎么办?可用来将行内元素转化为块元素?通过display可以修改元素的类型 可选择的值inline:可以将元素作为内联元素显示.block:可以将一个元素设置为块显示inline-block:将一个元素转化为行内块,又有块的特点,即可以设置宽高,又不会独占一行none:不显示元素并且元素不在页面中占有位置使用display:none 的方法隐藏元素,不会在页面中显示,并且不占据页面的位置!设置元素框的类型 可选值block inli.
2021-11-02 08:51:43
221
原创 标签的嵌套规范
标签本身就是有很多嵌套规范的，例如：table > tr ， ul(ol) > li ， dl > dt ，这些标签之间必须紧密相接，不能插入其他标签。块标签可以嵌套内联标签块标签不一定能嵌套块标签p不能嵌套div内联标签不能嵌套块标签不能自己嵌套自己的标签超链接不能嵌套超链接p标签不能嵌套p标签标题标签h1-h6之间不能互相嵌套也不能自己1、行内标签不能嵌套块标签，块标签可以嵌套行内标签。2、a标签不能嵌套a标签3、h1-h6,dt这些标签的性...
2021-11-01 17:01:45
2503
原创 行内元素浮动,以及块元素浮动
行内元素横向排列不可以设置宽高 内外边距,大小是内容大小当其浮动后就变的像行内块元素,就可以设置宽高! 内外边距块元素Block块级元素的宽是独占一行，如果不设置，宽度继承100%占满文档inline-block元素却是仅以自身内容为宽度。元素浮动后，Block块级元素的显示模式变成了inline-block,宽度本身是100%的元素，因为显示模式的改变，宽度变为自身内容宽度。浮动后元素的高Block块级元素的高，通常为显式盒模型高，或者是隐式内容撑高...
2021-11-01 16:56:18
973
原创 清除css浮动八种方法以及优缺点
CSS清除浮动的8种方法以及优缺点浮动会使当前标签产生向上浮的效果，同时会影响到前后标签、父级标签的位置及 width height 属性。而且同样的代码，在各种浏览器中显示效果也有可能不相同，这样让清除浮动更难了。解决浮动引起的问题有多种方法，但有些方法在浏览器兼容性方面还有问题。下面总结8种清除浮动的方法（测试已通过 ie chrome firefox opera，后面三种方法只做了解就可以了）：1，父级div定义 height<style type="text/css">...
2021-11-01 15:45:02
92
原创 清除行内元素(标签)之间html的空白方法
使用行内标签 编辑器上换行时,网页会识别成空格,会占位,显示在屏幕上!!解决方法:1 粗暴的将标签换行删掉(代码布局很丑)2 添加font-size:0;最好的办法就是在外层元素上设置font-size:0;(清楚了标签的空白)同时在内层上设置文字大小(抵消外层设置带来的字体影响,当然如果对字体没要求也可以不写)3 添加注释<a>右边<a><!----><a>左边<a>这样就不会有空格识别,问题解决4 使用m
2021-11-01 15:25:14
565
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人