随笔分类 - 面试
摘要：前端设计模式梳理 一、什么是设计模式？ 设计模式是一套被反复使用、多数人知晓、经过分类编目的、代码设计经验的总结。它是为了可重用代码，让代码更容易的被他人理解并保证代码的可靠性。 设计模式实际上是“拿来主义”在软件领域的贯彻实践，它是一套现成的工具，拿来即用。下面来看一下设计模式的设计原则。 二、设
阅读全文
摘要：前端面试题 - 综合练习 点击按钮隐藏元素 请补全JavaScript代码，实现一个盒子的关闭按钮功能。 要求： 使类为"btn"的div元素中心点定位在类为"box"的div元素右上顶点 使类为"btn"的div元素中内容"X"垂直水平居中 点击"X"按钮可以使类为"box"的div元素隐藏 <!
阅读全文
摘要：前端面试题 - webAPI 元素操作 JS动态创建节点 请补全JavaScript函数，根据参数数组创建li元素。 要求： li元素的个数和数组的长度一样 li元素的内容是数组中的每个元素 将创建的所有li元素插入到ul中 // innerHTML function createLi(array)
阅读全文
摘要：前端面试题 - js - es5 数据类型 基本数据类型检测 请补全JavaScript函数，要求以字符串的形式返回参数的类型。 注意：只需检测基本数据类型。 function _typeof(value) { // 补全代码 let str = Object.prototype.toString.
阅读全文
摘要：js - 数据类型检测方法 通用但很繁琐的方法：prototype function dataType(val) { return Object.prototype.toString.call(val).slice(8,-1) } alert(Object.prototype.toString.ca
阅读全文
摘要：css 选择器 标签、类、ID选择器 请将html模块中字体内容是"红色"的字体颜色设置为"rgb(255, 0, 0)"，"绿色"设置为"rgb(0, 128, 0)"，"黑色"设置为"rgb(0, 0, 0)"，且字体大小都为20px。 <html> <head> <meta charset=u
阅读全文
摘要：html 基本标签 表单类型 描述 请依次写出以下类型的输入框。 类型为密码，默认值为"nowcoder" 类型为复选框，且状态为已勾选 <form> <!-- 补全代码 --> <input type="password" value="nowcoder" /> <br /> <input typ
阅读全文
摘要：flexible what 终端设备适配的解决方案。在不同的终端设备中实现页面适配。 提示 另外强烈建议对JS做内联处理，在所有资源加载之前执行这个JS。执行这个JS后，会在元素上增加一个data-dpr属性，以及一个font-size样式。JS会根据不同的设备添加不同的data-dpr值，比如说2
阅读全文
摘要：面试知识点 jq Vue 初级 生命周期 v-if,v-show区别 组件通信方式 路由传参 哪几种方式 区别 data 为什么是函数不是对象 create 和 mounted 区别 computed 和 watch 区别 指令有哪些 修饰符有哪些 中级 双向绑定原理 模板原理 虚拟dom mvvm
阅读全文
摘要：响应式和自适应 概述 响应式布局等于流动网格布局，而自适应布局等于使用固定分割点来进行布局。 响应式 what 响应式布局Responsive design，意在实现不同屏幕分辨率的终端上浏览网页的不同展示方式。通过响应式设计能使网站在手机和平板电脑上有更好的浏览阅读体验。 step 设置 Meta
阅读全文
摘要：js - 大文件上传下载 大文件上传-分片上传 分片上传的好处是将一个大请求分成多个小请求来执行，这样当其中一些请求失败后，不需要重新上传整个文件，而只需要上传失败的分片就可以了。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-
阅读全文
摘要：优化高度限制 预览 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta
阅读全文
摘要：从输入url到页面展示到底发生了什么 |-- 域名解析（获得IP地址） |-- 向WEB服务器发送HTTP请求 |-- 服务器处理请求 |-- 服务器返回HTTP响应 |-- 浏览器显示页面信息 输入地址 当输入url地址后，浏览器已经在智能匹配地址了，会从历史记录、书签或缓存中查找，如果找到了，会
阅读全文
摘要：dns查询 三次握手 http请求 DNS解析 TCP连接 发送HTTP请求 服务器处理请求并返回HTTP报文 浏览器解析渲染页面 连接结束
阅读全文
摘要：keepalive重新渲染 https://blog.csdn.net/qq_29132907/article/details/80250742 图片懒加载 data为什么是方法 组件中的data写成一个函数，数据以函数返回值形式定义，这样每复用一次组件，就会返回一份新的data，类似于给每个组件实
阅读全文
摘要：1.原生JS实现图片懒加载（考虑不重复加载以及节流） 知识点：视口位置判断，懒加载实现（data-set），节流等 1.Element.getBoundingClientRect() 该方法返回元素的大小及其相对于视口的位置, 具体解释及用法参考 MDN. 通过 Element.getBoundin
阅读全文
