- 博客(106)
- 收藏
- 关注
RSS订阅
原创 CSS正方体背面不可见
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{margin: 0;padding: 0;} body{ /*搭建3D环境*/ tr...
2020-03-16 19:54:40
392
原创 overflow文本溢出几种属性
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> *{margin:0;padding:0;} .box1{ width:100px; height:100px; ...
2020-03-14 11:23:30
123
原创 CSS盒模型细节讲解
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .box{ width: 186px; height:186px; backgroun...
2020-03-13 21:55:10
922
原创 CSS样式表权重关系
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="css/style2.css"> <style type="text/css"> @...
2020-03-13 19:58:46
224
1
原创 jQ里add与slice方法的使用
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src = 'jq
2020-06-14 23:42:15
514
原创 jQ节点操作
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src = 'jq
2020-06-14 23:40:37
213
原创 jquery里删除节点remove与detach
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style>
2020-06-14 23:38:53
232
原创 jQ获取文本属性text和html区别
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src = 'jq
2020-06-14 23:36:25
174
原创 jquery动画animate的方法
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style>
2020-06-14 23:33:48
171
原创 js处理函数的节流与防抖的方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script> //
2020-06-14 23:31:25
119
原创 jquery的节点操作的几种方法
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src = 'jq
2020-06-14 23:29:45
306
原创 jquery获取网页元素
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <!-- 引入jquery --&
2020-06-14 23:27:59
598
原创 jquery获取元素的几种方法
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <!-- 引入jquery --&
2020-06-14 23:26:14
627
原创 JS实现选择排序
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script> //
2020-06-10 23:40:41
117
原创 JS实现冒泡排序
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script> v
2020-06-10 23:39:53
86
原创 事件委托
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="../../utils.js"></script&g
2020-06-10 23:37:26
78
原创 JS事件冒泡
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #yeye { width: 350px;
2020-06-10 23:34:04
103
原创 JS事件的几种类型
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> div { width: 200px;
2020-06-10 23:30:42
274
原创 JS中DOM元素的位置
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .box { width: 200px;
2020-06-10 23:25:35
405
原创 JS中 DOM尺寸获取的一些方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="../../utils.js"></script&g
2020-06-10 23:19:12
304
原创 JS查找节点
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <div>div1</d
2020-06-10 23:15:09
426
原创 JS文档碎片
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <ul></ul>
2020-06-10 23:13:14
220
原创 JS中元素节点的操作
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .box { width: 200px;
2020-06-10 23:12:24
89
原创 JS节点的获取方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <div> <!
2020-06-10 23:11:10
243
原创 JS中innerHTML和innerText的区别
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <button onclick="f
2020-06-10 23:09:52
143
原创 JS中获取网页元素id和class的操作
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <button onclick="f
2020-06-10 23:02:33
1824
原创 js中获取自定义属性的方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <ul> <li
2020-06-10 23:01:22
586
原创 JS中Window的事件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script> // 当代码执行到这里的时候，div还没有杯渲染出来，所以
2020-06-10 23:00:07
909
原创 JS中 querySelector和querySelectorAll选择网页元素
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <h1 id=title>ti
2020-06-10 22:58:26
424
原创 JS中获取元素的几种方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <div id="box">b
2020-06-10 22:45:31
1259
原创 三种键盘事件的区别
onkeyup： 这个事件在用户按下并放开任何字母数字键时发生。系统按钮（例如，箭头键和功能键）无法得到识别。 onkeydown： 这个事件在用户放开任何先前按下的键盘键时发生。onkeypress ： 这个事件在用户按下任何键盘键（包括系统按钮，如箭头键和功能键）时发生。 三者之间的执行顺序： 当按下回车时，焦点从文本框移到按钮上。如果把它换成“onkeypress”，焦点不会转移，也不会失去。但是如果换成“onkeyup”，则失去焦点，页面
2020-06-05 20:10:43
719
原创 锋利的ES6 — 常用新特性
letlet命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。什么叫代码块？简单地说：使用{}括起来的代码被称为代码块。比如：if、for、try…catch这些都是代码块var a = 20if (a % 2 === 0) { let b = 5}console.log(b) // ReferenceError: b is not defined.我们可以看到，在if块里用let定义的b变量在这个块级外面是不可使用的。let还有一个特点
2020-05-12 20:52:23
113
原创 锋利的ES6 — 常用新特性（1）
箭头函数箭头函数表达式的语法比函数表达式更简洁，并且没有自己的this，arguments，super或new.target。箭头函数表达式更适用于那些本来需要匿名函数的地方，并且它不能用作构造函数。箭头函数的语法是 (param1, param2, …, paramN) => { statements } // 当函数体只有一句而且这一句就是返回值的时候，函数体的{}以及return关键字都可以省略 // 以下相当于：(param1, param2, …, p
2020-05-12 00:49:41
109
原创 网格布局
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{margin: 0;padding: 0;} .box{ width: 600px; ...
2020-03-26 22:28:21
106
原创 移动端适配之流体布局 rem布局详细解说
一、流式布局（百分比布局）使用非固定像素来定义网页内容，也就是百分比布局，(特别适合于电商网站的布局)通过盒子的宽度设置成百分比来根据屏幕的宽度来进行伸缩，不受固定像素的限制，内容向两侧填充。这样的布局方式，就是移动web 开发使用的常用布局方式。这样的布局可以适配移动端不同的分辨率设备。二、rem布局（局限条件：主要用来适配手机和ipad,除了手机和ipad，其他的都不能适配。）rem布局...
2020-03-24 23:52:17
288
原创 移动端适配案列
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"...
2020-03-24 23:35:55
87
原创 移动端布局之rem+px+vw单位换算
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{margin: 0;padding: 0;} html{ font-size:100px;...
2020-03-24 23:34:38
764
原创 移动端布局之rem解析
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{margin: 0;padding: 0;} html{ font-size:100px;...
2020-03-24 23:33:27
68
原创 HTML移动端适配准备
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"...
2020-03-24 23:32:03
258
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人