前端开发
nanotry
何妨一试
展开
-
HTML基础
HTML基础HTML简介超级文本标记语言是标准通用标记语言下的一个应用,也是一种规范,一种标准,它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)。浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容,对书写出错的标记将不指出其错误,且不停止其解释执行过程,原创 2017-07-12 16:26:44 · 425 阅读 · 0 评论 -
HTML本地存储
HTML本地存储方式有:cookie、localStorage、sessionStorage、indexDB和HTML5离线缓存cookiecookie一般用于保存用户的相关信息,并实现维持会话的功能。服务器响应请求时在请求头里添加Set-Cookie字段,浏览器将该字段保存为本地的cookie。cookie绑定在特定域名下,当再次向该域名发送请求时,请求头里将包含该cooki...原创 2018-03-06 22:18:30 · 1591 阅读 · 0 评论 -
CSS选择器
基本选择器 选择器 语法 类型选择器2 elename 类选择器 .classname ID选择器 #idname 通用选择器 * 属性选择器 [attr] 选择存在attr属性的元素[attr=value]选择attr属性为value的元素[attr~=value]选择 attr 属性的值(以空格间隔出多个值)中有包含...原创 2018-03-07 23:46:29 · 196 阅读 · 0 评论 -
JavaScript中类型判断:typeof、constructor、Object.propotype.toString.call()的比较
方式 语法 优点 缺点 typeof typeof(data) typeof data 返回结果为js基本的数据类型,包括umber、boolean、string、object、undefined、function 不能判断null、array、regexp、自定义类 constructor data.constructor 能判断自定...原创 2018-02-28 20:29:02 · 498 阅读 · 0 评论 -
JavaScript事件
事件流 事件流描述的是从页面中接收事件的顺序 事件流 描述 事件冒泡 IE的事件流,事件从最具体的节点开始,然后逐级向上冒泡到不具体的节点 事件捕获 不具体的节点先接收到事件,具体的节点最后接收到事件 DOM事件流 DOM事件流包含三个阶段:事件捕获、处于目标事件阶段、事件冒泡阶段事件处理程序 事件处理程序包括:...原创 2018-03-09 15:01:06 · 181 阅读 · 0 评论 -
从输入URL到页面显示
当输入URL、敲下回车、最后浏览器页面显示,这里面有什么故事?键盘到操作系统、操作系统到浏览器、浏览器到服务器、服务器返回数据页面渲染……键盘到操作系统回车键按下时,与键盘相关的电路闭合,通过消抖操作,键盘的电路系统将回车键转化为键码13。按键被按下会触发中断事件,回车键的键码被编码并通过通用串行总线(USB)传输到中断请求线上(IRQ),中断控制器接收到IRQ上的信号后,会映...原创 2018-03-10 15:17:02 · 2198 阅读 · 1 评论 -
JavaScript设计模式——单例模式
What保证一个类只有一个实例,并为其提供一个访问它的全局访问点。Why有一些对象我们往往只需要一个,比如线程池、全局缓存、登录浮窗等。对于这些对象可以采用单例模式来构建,避免多次创建浪费资源。How单例模式只需要创建一个对象,因此在创建对象时,首先判断是否有创建的对象,如果有就直接返回该对象,否则生成一个新对象。例如let instance;function Sin...原创 2018-04-12 17:18:38 · 287 阅读 · 0 评论 -
圣杯布局和双飞翼布局
圣杯布局<style> .wraper{ padding: 0 200px 0 100px; overflow: hidden; } .main, .left, .right{ text-align: center; height: 100px; float: left; ...原创 2018-05-26 11:33:30 · 182 阅读 · 0 评论 -
使用Koa mock数据和使用fetch获取数据
Koa mock数据和使用fetch获取数据Koa官网MDN上关于fetch的解释使用Koa 前端开发中,在后端接口未完成的情况下如何获取数据?可以采用Mock数据的方式,按照后端提供的接口格式临时生成数据。安装Koanpm install koa koa-body koa-router --save-dev使用Koaconst Koa =...原创 2018-05-16 01:39:19 · 2017 阅读 · 0 评论 -
JavaScript正则表达式
创建正则表达式使用字面量/*** /正则表达式主体/修饰符(可选)*/var r = /(\d+)/g;使用Reg构造器var r = new RegExp("(\d+)","g");正则表达式修饰符 修饰符 含义 g 全局匹配 i 忽略大小写 m 多行匹配正则表达式特殊字符元字符 ...原创 2018-02-26 22:55:53 · 165 阅读 · 0 评论 -
CSS清除浮动
浮动float是网页布局的常客,可这位客人有时并不”友好”.在使用浮动的时候,我们惊奇的发现,网页后面的内容与浮动元素重合了.这,得想办法解决掉!原创 2017-12-07 23:47:30 · 212 阅读 · 0 评论 -
webpack v1.x使用
翻译自 http://webpack.github.io/docs/tutorials/getting-started/欢迎这篇简短的教程将通过一个小的示例指导你如何使用webpack。 你将学会:如何安装webpack如何使用webpack如何使用loaders如何使用development server翻译 2017-11-25 11:07:54 · 596 阅读 · 0 评论 -
JS实现倒计时动画效果
js通过Date对象实现倒计时效果原创 2017-10-27 00:02:47 · 2205 阅读 · 0 评论 -
JS实现信息滚动制作
关键:setInterval(function,time); //每隔一个时间间隔执行一次函数setTimeout(function,time); //在一段时间后执行一次函数scrollTop属性:元素隐藏部分的高度。scrollTop属性只有DOM元素才有,window/document没有原创 2017-10-30 23:38:23 · 451 阅读 · 0 评论 -
Flex布局
使用display、float、position等传统布局方式实现水平居中、垂直居中等布局很不方便,而利用Flex布局,我们可以轻松实现各种页面布局。采用 Flex 布局的元素,称为 Flex 容器,简称”容器”。容器的所有子元素自动成为容器成员,称为 Flex 项目,简称”项目”。容器默认存在两根轴:水平的主轴和垂直的交叉轴。项目默认沿主轴排列。原创 2017-11-08 23:43:38 · 219 阅读 · 0 评论 -
JavaScript基本概念
Javascript是一种专为与网页交互而设计的脚本语言,有下列三个不同的部分组成:ECMAScript,由ECMA-262定义,提供核心语言功能文档对象模型(DOM),提供访问和操作网页内容的方法和接口浏览器对象模型(BOM),提供与浏览器交互的方法和接口原创 2017-09-24 16:32:57 · 365 阅读 · 0 评论 -
Ajax(原生js实现、jQuery实现、跨域)
传统的网页如果要加载新内容,需要重新加载整个页面。这会对网络流量产生过多负荷,用户体验感也随之下降。而使用Ajax技术则可以在不加载新页面的情况下获取刷新数据。XMLHttpRequestAjax无需页面刷新即可进行数据的交互,是基于浏览器内置的XMLHttpRequest对象来实现的。原创 2017-11-10 21:53:50 · 623 阅读 · 0 评论 -
JS动画效果(样式获取、链式动画、动画框架)
上一篇”JS动画效果”中使用setInterval()定时修改对象样式,从而实现动画效果。修改对象样式时需要获取对象原有的样式值,通过对象的offsetLeft、offsetWidth等属性来获取对象的样式。但在运用中,offsetLeft、offsetWidth等属性只能获取少量的样式值,而且offsetWidth等并不难准确获取我们需要的样式值。原创 2017-10-25 21:44:45 · 1704 阅读 · 0 评论 -
JS动画效果(移动、透明度、缓冲、多物体)
JavaScript中可以通过setInterval()函数来实现动态效果。 setInterval()函数设置一个定时器,可以按照指定周期调用函数或计算表达式。setInterval()可以不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。原创 2017-10-24 23:46:57 · 506 阅读 · 0 评论 -
CSS层叠上下文以及z-index
网页设计中多个元素重叠时,如何处理各个元素的层叠顺序?我们常常用z-index来控制元素层叠顺序,元素层叠显示的原理又是什么呢?层叠上下文什么是层叠上下文: 每个元素都具有三维的空间坐标,处理水平和垂直外,还有一个Z轴坐标,通过改变Z轴坐标,我们可以实现元素的层叠.而包含这一组堆叠层的元素就是层叠上下文.如何创建层叠上下文:根元素会自动形成层叠上下文z-index值为数值的定位元素也具有层叠上原创 2017-12-02 19:04:04 · 469 阅读 · 0 评论 -
CSS实现水平居中和垂直居中
水平居中行内元素 为父元素设置中’text-align:center’样式<div style="text-align: center"> <span>行内元素水平居中</span></div>定宽块级元素 定义元素左右margin为auto<div> <div style="width: 100px;height: 100px;background-color: gree原创 2017-11-03 10:28:52 · 2430 阅读 · 0 评论 -
Promise对象解析
Promise Promise对象用于表示一个异步操作的最终状态(完成或失败)以及其返回的值。一个例子假设我们现在用Js异步请求一个文件并在请求文件后对文件数据进行处理请求数据和处理数据函数function ajaxFile(callback){ // 模拟数据请求 setTimeout(function(){ console.lo...原创 2018-05-30 19:12:53 · 2628 阅读 · 0 评论