前端
xxxjun_
这个作者很懒,什么都没留下…
展开
-
构造函数继承、闭包
// 继承 // 构造函数中,子类可以继承父类构造函数的方法 原型继承 // 声明一个 人 的构造函数 function Person(name) { this.name = name this.say = function () { console.log(this.name + '能说话'); } } ...原创 2021-12-27 17:58:04 · 268 阅读 · 0 评论 -
Ajax、cookie
1.HTTP协议 HTTP(超文本传输协议)是一个基于请求与响应的模式、无状态的、应用层的协议、绝大多数的web开发,都是勾践在HTTP协议之上的2.Ajax 浏览器与服务器通讯而无需刷新当前页面的技术,不需要刷新当前页面,只刷新局部页面的一种异步通讯技术. //1.实例化ajax核心对象xmlhttpRequest const xhr = new window.XMLHttpRequest //2.建立链接 .原创 2021-12-25 15:57:48 · 402 阅读 · 0 评论 -
面向对象、原型、异步
面向对象: 找解决问题的对象,调用其功能方法解决问题,如果对象不存在,自己创建对象构造函数: 构造函数名与数据类型名相同 第一个字母大写 函数体中使用this关键字定义对象的属性和方法 使用new语句调用构造函数创建对象原型: 每个构造函数(对象)都有一个prototype属性指向它的原型(原型对象) 所有实例对象都可以访问原型对象上定义的公共的属性和方法 //定义一个构造函数 function Student.原创 2021-12-15 18:59:09 · 827 阅读 · 0 评论 -
正则表达式
// 正则 //用某种模式表达一类字符串的公式 //方法 正则表达式.test(字符串) //=>返回布尔值 字符串.match(正则) //=>返回符合的 数组 字符串.replace(正则,新内容) //替换, 返回替换后的字符串 字符串.search(正则) //返回下标,没有返回-1 // test 为正则的方法,其它都是字符串的方法 //常用 let rng = /\d/ .原创 2021-12-13 20:44:40 · 346 阅读 · 0 评论 -
ES6新增语法
// ES6新语法 // ECMA Script // 改变this指向调通函数时使用call fn.call(obj, 1) // 此时第一个值为改变this的指向, 第二个值开始为形参 // 自调用函数 (function () { //函数执行代码 arguments //所有实参的集合,是一...原创 2021-12-11 09:16:35 · 151 阅读 · 0 评论 -
冒泡排序、选择排序、数组去重
1.冒泡排序 挨着两个数,两两相比,如是前一个值比后一个值大,就交换位置 一轮之后最大的值排在后面,在未排序的值中重复以上操作 var arr = [10,5,2,18,60,5,18] for(var i = 0;i < arr.length - 1;i++){ for(var a = 0;a < arr.length - 1 - i;a++){ if(arr[a] > arr[a + 1]){ ...原创 2021-11-30 19:50:49 · 598 阅读 · 0 评论 -
用边框实现三角形、复选框样式、怪异盒子
1.实现三角形 1.实现一个宽高为0的盒子 2.给边框设置成有粗度的透明色 透明transparent border:*px solid transparent 3.给想要的方向的边框设置成对应的颜色2.实现好看的复选框 1.实现框和勾勾 【勾勾由设置相邻两边边框旋转得到】 2.设置定位和浮动-让框和文字横着排列,让勾显示在框上面 3.让勾勾隐藏 4.选中对应的选项的时候里面的勾勾显示出来。...原创 2021-11-22 18:19:50 · 173 阅读 · 0 评论 -
移动端布局、响应式
1.响应式 概念:一套代码,能够适应多个终端。【页面能够根据屏幕尺寸、设备类型等,实现不一样的页面效果】 原理:利用媒体查询。 关键字: @media 属于说明: 设备像素:屏幕的物理像素 逻辑像素:css上的像素 dpr = 设备像素/逻辑像素 理想视口: 可视视口/布局视口 = 1; 理想视口的设置<meta name="viewport" content...原创 2021-11-16 17:23:04 · 203 阅读 · 0 评论 -
弹性盒子.
1.弹性盒子 概念:是一种新的布局方式,主要是让元素有能力控制子元素的排列方式。常用语移动端 1.容器上的属性 1.设置成容器 disolay:flex 丨 inline-flex; [flex是弹性盒子,inline-flex是行内块弹性盒子] 2.设置主轴的方向 flex-direction:row 丨 column 丨row-reverse 丨 column-reverse;...原创 2021-11-12 16:49:23 · 235 阅读 · 0 评论 -
H5新增标签
1.语义化标签 概念:有意义的标签,提倡用正确的标签去描述有对应含义的内容。 1.结构上的语义化标签。 页头 <header></header> 导航 <nav></nav> 主体 <main></main> 独立的区域 <section></section&g...原创 2021-11-09 16:08:59 · 139 阅读 · 0 评论 -
精灵图、兼容性
1.精灵图/雪碧图 sprites 概念:由多张图组合成的一张图 实现步骤: 1.实现一个指定带下的盒子 2.讲精灵图设置为该盒子的背景图 3.通过background-position属性,设置背景图的起始位置 优缺点: 减少访问次数,提升性能 占用内存小 文件数量小,命名难度小 缺点:增删图片麻烦...原创 2021-11-09 16:08:06 · 93 阅读 · 0 评论