摘要: 问题描述: 用vue封装一个swiper组件的时候,发现轮播图不能轮播了。 原因: 异步请求的时间远大于生命周期执行的时间,mounted初始化DOM时数据未返回,渲染数据是空数组,导致轮播图的容器层宽度为0,渲染轮播图不能滚动。 解决思路: 数据返回之后再做初始化操作。 解决方法: 一、容器没有宽 阅读全文
posted @ 2019-08-17 23:26 吴小明- 阅读(1403) 评论(0) 推荐(0)
摘要: vue最大的特点就是数据驱动视图。 vue的数据改变,页面一定发生改变?不一定。 当操作引用类型的数据,动态添加属性时,页面不会发生改变。 vue响应式数据原理(也叫数据绑定原理、双向数据绑定原理): 底层是Object.defineProperty(),目前用的vue2.6版本和将来更新的vue3 阅读全文
posted @ 2019-08-17 23:04 吴小明- 阅读(1119) 评论(0) 推荐(0)
摘要: 1、字面量的方式 缺点: 比较麻烦,每个属性都需要添加 var obj={ name:"小明", age:16 } 2、构造函数的方式 缺点: 如果要批量生成多个对象,会产生大量重复代码 var obj=new Object(); 3、将一个对象作为原型,创建另一个对象 obj1继承了obj的属性和 阅读全文
posted @ 2019-08-17 17:53 吴小明- 阅读(1357) 评论(0) 推荐(0)
摘要: 1、字符模板 2、解构赋值 3、箭头函数 4、扩展运算符 ··· 5、symbol 6、let和const 7、set和map对象 8、class类 9、es6的模块化 export default或者export导出,import导入 10、Promise 11、函数在声明的时候可以对参数赋初始值 阅读全文
posted @ 2019-08-17 17:02 吴小明- 阅读(153) 评论(0) 推荐(0)
摘要: 1、XHTML必须被正确的嵌套 2、XHTML元素必须被关闭 3、XHTML标签名必须用小写字母 4、XHTML文档必须拥有根元素 阅读全文
posted @ 2019-08-17 11:46 吴小明- 阅读(267) 评论(0) 推荐(0)
摘要: ①给父元素单独定义高度 优点:简单快速、代码少。 缺点:无法进行响应式布局。 ②在标签结尾处加空div标签<div style="clear: both"></div> 优点:简单快速、代码少,兼容性较高。 缺点:增加空标签,不利于页面优化。 ③父级定义overflow:hidden 优点:简单快速 阅读全文
posted @ 2019-08-17 00:44 吴小明- 阅读(154) 评论(0) 推荐(0)
摘要: document.write是直接重写整个页面,innerHTML针对所属DOM节点进行重写,效率优于document.write。 阅读全文
posted @ 2019-08-17 00:43 吴小明- 阅读(224) 评论(0) 推荐(0)
摘要: <div id="left">我是左边</div> <div id="center">我是中间</div> <div id="right">我是右边</div> html,body{ margin: 0px;width: 100%; } #left,#right{width: 200px;heigh 阅读全文
posted @ 2019-08-17 00:43 吴小明- 阅读(947) 评论(0) 推荐(0)
摘要: bind on live one 简写事件:click、hover、mousemove、mouseup、mousedown…… 阅读全文
posted @ 2019-08-17 00:42 吴小明- 阅读(307) 评论(0) 推荐(0)
摘要: 1、什么是ajax ajax是Asynchronous Java and XML的缩写,是一种异步请求数据的web开发技术,在不需要重新刷新页面的情况下,ajax通过异步请求加载后台数据,并在网页上呈现出来 2、ajax使用场景 异步请求:登录、列表页、详情页、搜索下拉框……页面中涉及到数据的都用到 阅读全文
posted @ 2019-08-17 00:42 吴小明- 阅读(320) 评论(0) 推荐(0)
摘要: link @import从属关系: 标签 属性加载顺序: 加载页面时css同时加载 css在页面加载完加载兼容性: 不存在兼容问题 IE5+识别DOM操作: 可以操作 不可以操作权重: 权重较大 权重较小 阅读全文
posted @ 2019-08-17 00:41 吴小明- 阅读(122) 评论(0) 推荐(0)
摘要: attribute property 标签属性 对应html 对象属性对应DOM 获取的值是字符串 获取的值根据属性是什么类型的 可以获取自定义标签 不能获取自定义标签 获取自定义属性忽略大小写 Attribute:HTML属性,书写在标签内的属性,使用setAttribute()和getAttri 阅读全文
posted @ 2019-08-17 00:40 吴小明- 阅读(721) 评论(0) 推荐(0)
摘要: 两个相邻的盒子垂直方向上的margin会发生重叠,取较大的那个值,而不是相加。 解决: 父级设置padding代替margin 父级设置overflow:hidden 当前元素设置透明的边框 使用绝对定位 使用浮动或设置成行内块 给一个1像素的内边距 说了这么多,不这样干不行么,直接加一下写一个ma 阅读全文
posted @ 2019-08-17 00:39 吴小明- 阅读(340) 评论(0) 推荐(0)
摘要: display:none visibility:hidden 不占位 占位 不能继承 能继承 c3的transition不支持 transition支持 阅读全文
posted @ 2019-08-17 00:38 吴小明- 阅读(134) 评论(0) 推荐(0)
摘要: web标准:将结构、表现、行为分离,使其更具有模块化。 w3c标准:标签字母要小写,双标签要闭合,标签不允许随意嵌套。 尽量使用外部样式和外链js,使结构、表现、行为分为三块,这样可以提高页面渲染速度。 样式尽量少用行内样式,id和class名要做到见名知意。 不需要变动页面内容,便可提供打印版本, 阅读全文
posted @ 2019-08-17 00:36 吴小明- 阅读(340) 评论(0) 推荐(0)
摘要: ∞->行内->id->class、属性选择器、伪类选择器->标签选择器->通配符选择器 阅读全文
posted @ 2019-08-17 00:36 吴小明- 阅读(124) 评论(0) 推荐(0)
摘要: ①alt作为图片的替代文字出现,title作为图片的解释文字出现。 ②alt属性应用较少,如img、area、input中,title应用较多,如a、form、input、还有div、p这些块级元素都可以用。 ③alt仅作为标签属性,title也可以是标签,它是网页的标题标签。 阅读全文
posted @ 2019-08-17 00:35 吴小明- 阅读(2258) 评论(0) 推荐(0)
摘要: document load文档的所有内容都加载完成 document ready文档的DOM加载完成 阅读全文
posted @ 2019-08-17 00:35 吴小明- 阅读(191) 评论(0) 推荐(0)
摘要: 新选择器,属性选择器、伪类选择器、层次选择器... 圆角属性border-radius font-face加载服务器端的字体 多列布局column 阴影shadow 弹性盒flex 过渡transition 动画animation 媒体查询@media 阅读全文
posted @ 2019-08-17 00:35 吴小明- 阅读(140) 评论(0) 推荐(0)
摘要: label便签用可以让用户点击文字区域,自动聚焦到当前项的input框。 input设置id属性,label设置for属性,for属性的属性值为id属性值。 阅读全文
posted @ 2019-08-17 00:34 吴小明- 阅读(1207) 评论(0) 推荐(0)
摘要: Array.prototype.sort1=function(fn){ var len=this.length; while(len>0){ for(var i=0;i0){ var temp=this[i]; ... 阅读全文
posted @ 2019-08-17 00:34 吴小明- 阅读(356) 评论(0) 推荐(0)
摘要: console.log(getJson(url)); function getJson(url){ var obj={}; var arr=url.split("?")[1].split("&"); for(var i=0;i<arr.length;i++){ ... 阅读全文
posted @ 2019-08-17 00:33 吴小明- 阅读(1760) 评论(0) 推荐(0)
摘要: function trim1(str){ return str.replace(/(^\s*)|(\s*$)/g,""); } 阅读全文
posted @ 2019-08-17 00:32 吴小明- 阅读(459) 评论(0) 推荐(0)
摘要: function noRepeat(arr) { var arr1 = []; for (var i = 0; i < arr.length; i++) { var item = arr[i]; if (arr1.indexOf(item) === -1) arr1.p... 阅读全文
posted @ 2019-08-17 00:31 吴小明- 阅读(458) 评论(0) 推荐(0)
摘要: 设置字符编码 设置视口内容 规定页面描述、关键词、文档的作者、最后的修改时间等 利于搜索引擎优化,提供其他web服务 阅读全文
posted @ 2019-08-17 00:31 吴小明- 阅读(265) 评论(0) 推荐(0)
摘要: 一、 二、 三、 阅读全文
posted @ 2019-08-17 00:30 吴小明- 阅读(635) 评论(0) 推荐(0)
摘要: 第一种方法: 第二种方法:引入decode.js插件 阅读全文
posted @ 2019-08-17 00:29 吴小明- 阅读(744) 评论(0) 推荐(0)
摘要: null是空对象,转为数值为0,undefined是未定义,转为数值为NaN。 null:作为函数的参数,表示该函数的参数不是对象。 作为原型链的终点。 undefined:变量声明但未赋值。 调用函数的时候,应该提供的参数没有提供。 对象没有赋值的属性,该属性值为undefined。 函数没有返回 阅读全文
posted @ 2019-08-17 00:28 吴小明- 阅读(214) 评论(0) 推荐(0)
摘要: 弹性盒模型是c3规范的新的布局方式,该布局模型的目的是提供一种更加高效的方式来对容器的条目进行布局、对齐和分配空间。在传统的布局中,block布局是把块级元素在垂直方向从上向下一次排列的,而inline布局则是在水平方向来排列。弹性盒布局没有这样的内在限制,操作比较自由。 适用于移动端,在Andro 阅读全文
posted @ 2019-08-17 00:27 吴小明- 阅读(1768) 评论(0) 推荐(0)
摘要: 谷歌 IE:监听:addEventListener attachEvent 要在事件名称前面加on解绑:removeEventListener detachEvent 要在事件名称前面加on阻止冒泡:e.stopPropagation() e.cancelBubble=true阻止默认:e.prev 阅读全文
posted @ 2019-08-17 00:26 吴小明- 阅读(244) 评论(0) 推荐(0)
摘要: 父级给相对定位,子级给绝对定位,margin设置为auto,上下左右值设为0。 父级给相对定位,子级给绝对定位,设置left和top为50%,再向左和向上移动负的子级一半。 position: absolute; left: 50%; top: 50%; transform: translate(- 阅读全文
posted @ 2019-08-17 00:25 吴小明- 阅读(3248) 评论(0) 推荐(0)
摘要: 回调函数 事件监听 观察者模式 Promise async、await 阅读全文
posted @ 2019-08-17 00:24 吴小明- 阅读(206) 评论(0) 推荐(0)
摘要: function getCount(str) { for(var code=32;code<128;code++){ var mych=String.fromCharCode(code); var count=0; for(var i=0;i<str.length;i++){ var ch=str.charAt(i); if(ch mych){ count++; } } if(count>0){ 阅读全文
posted @ 2019-08-17 00:23 吴小明- 阅读(434) 评论(0) 推荐(0)
摘要: 当有一个元素未定义时,for和for...of遍历该元素为undefined,for...in遍历不到。 如果是自定义属性,for和for...of无法遍历,for...in可以遍历。 for...in是es5的,for...of是es6的。 for...in遍历的是键,for...of遍历的是值。 阅读全文
posted @ 2019-08-17 00:22 吴小明- 阅读(391) 评论(0) 推荐(0)
摘要: 浅克隆: 深克隆: 牛逼的来了 除了DOM和二进制流 阅读全文
posted @ 2019-08-17 00:15 吴小明- 阅读(234) 评论(0) 推荐(0)
摘要: 冒泡排序: 选择排序: 快速排序: 阅读全文
posted @ 2019-08-17 00:13 吴小明- 阅读(909) 评论(0) 推荐(0)
摘要: h5新特性: 语义化标签:<hrader></header> 、<footer></footer>、<nav></nav>、<section></section>、<article></article>、<aside></aside>、<video></video>、<audio></audio> 阅读全文
posted @ 2019-08-17 00:11 吴小明- 阅读(1249) 评论(0) 推荐(0)