随笔分类 - 前端开发
包括css，js，jquery，html等相关技术
摘要：登录权限控制包含着这么几个方面的含义： 1）不同的权限对应不同的路由 2）侧边栏需要根据不同的权限，异步生成 登录：使用用户名和密码，登录成功后返回用户的token（防止XSS攻击），将此token存放在cookie中（保证刷新页面后依旧能够记住用户的登录状态） 之后，前端根据token去拉取一个u
阅读全文
摘要：之前的文件下载功能一般是由前后端配合实现，由于项目需要，纯前端实现了一把excel的导出功能： 一、excel导出 1.安装依赖库 xlsx：这是一个功能强大的excel处理库，但是上手难度也很大，还涉及不少二进制的东西 file-saver:ES5新增了相关file,blob,fileList等A
阅读全文
摘要：一、将对象数组转换为对象 如果仅仅是提取其中的部分字段，可以这么写：
阅读全文
摘要：一、commonJS模块加载规范 CommonJS规范加载模块是同步的，也就是说，只有加载完成，才能执行后面的操作。由于Node.js主要用于服务器编程，模块文件一般都已经存在于本地硬盘，所以加载起来比较快，不用考虑非同步加载的方式，所以CommonJS规范比较适用。浏览器端一般采用AMD模块加载方
阅读全文
摘要：转载自自己在牛人部落中的相关文章 在前端css定位中经常面对的一个问题是，百分比定位究竟是针对于谁定位？ 一、margin，padding的百分比 首先从css的设计意图说起，在浏览器默认的 writing-mode: horizontal-tb; 和 direction: ltr; 的情况下，因为
阅读全文
摘要：****转载自自己发表于牛人部落专栏的文章**** 一、前言 本文记录了自己利用原生javascript构建自己的动画库的过程，在不断改进的过程中，实现以下动画效果： 针对同一个dom元素上相继发生的动画，针对以下功能，尝试实现方案，（从一个元素向多个元素的拓展并不难，这里不做深入探究）： 功能1.
阅读全文
摘要：一、css部分 1.如何实现sticky footer布局； http://www.open-open.com/lib/view/open1487572092207.html 2.、如何实现一行文本太多的时候适用省略号 3、如何实现背景图片的滤镜和模糊效果 可以给背景设置为透明度，来实现滤镜 同时添
阅读全文
摘要：一、使用label标签自定义checkbox,radio http://www.cnblogs.com/chaoyuehedy/p/5586735.html 一、vue源代码剖析 https://segmentfault.com/a/1190000006599500 三、前端面试题目集锦 https
阅读全文
摘要：为了将值转换为基本类型值（string，number，boolean,null,undefined）,抽象操作ToPrimitive会首先检查该值有没有valueOf()方法，如果有并且返回基本类型值，那么使用该值进行强制类型转换，如果没有就使用toString()的返回值进行强制类型转换。如果va
阅读全文
摘要：在实际开发中，很多时候需要知道某个节点是不是另一个节点的后代。很多浏览器提供了contains方法，如： DOM3提供的compareDocumentPosition方法也可以判断元素位置关系，结果如下： 1 无关 2 居前 4 居后 8 包含 16 被包含 因此跨浏览器的contains写法如下：
阅读全文
摘要：表单元素除了可以运用上述所有DOM相关操作外，为了简化，还有一系列自己的属性和方法。 表单除了支持鼠标，键盘，更改和html时间之外，还支持一些表单特有的事件，如focus,change,blur等等。 一、form表单元素 1.获取表单上的form元素 1)document.getElementB
阅读全文
摘要：浏览器对象模型BOM，提供了访问浏览器的接口。这些功能大多和网页内容无关，多年来，由于缺乏规范导致BOM中的不同方法在不同浏览器中的实现有所差异，直到html5，才将BOM的主要方面纳入规范。 BOM常用的特性包括： 一、window对象 window对象在浏览器中具有双重角色：它既是ECMAscr
阅读全文
摘要：javascript中，Date代表日期对象，其常见的用法如下： 一、Date的构造函数 有四种形式的Date构造函数，详见下面代码的注释： 二、返回日期对应的毫秒数 1.Date.parse() Date.parse()接收一个日期字符串，返回该日期对应的毫秒数。 2.Date.UTC() Dat
阅读全文
摘要：一个完整的javascript的实现应当由三部分构成： 1.核心（ECMAscript） ECMAscript与web浏览器并没有依赖关系，web浏览器只是ECMAscript实现可能的宿主环境之一，宿主环境不仅提供ECMAscript实现，也提供该语言的扩展。其他宿主环境包括nodeJs等。ECM
阅读全文
摘要：详情参见此篇博客 http://www.w3cplus.com/css/creaet-equal-height-columns 建议掌握方法四、五 其实，利用最新的flex布局 http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html http
阅读全文
摘要：一、transform css3引入了一些可以对网页元素进行变换的属性，比如旋转，缩放，移动，或者沿着水平或者垂直方向扭曲（斜切变换）等等。这些的基础都是transform属性 transform属性有一项奇怪的特性，就是它们对于其周围的元素不会产生影响。换句话说，如果将一个元素旋转45度，它实际上
阅读全文
摘要：响应式布局结合了三大理念： 1）用于布局的弹性网络（百分比定义宽度） 2）用于图片和视频的弹性媒体 3）媒体查询 在布局中，需要注意的点有： 1）尽量用min-width/max-width,max-height/min-height代替width,height 2)尽量使用百分比，em为单位代替精
阅读全文
摘要：一、高性能网站 《高性能网站建设指南》一书中提出用户只有10%-20%最终用户响应时间是花在从web服务器获取html文档并传送到浏览器中，80%的时间都花在了等待页面组件中，由此提出了构建高性能网站的14个规则。按照优先级排序依次是： 1.减少http请求数 直接方法是减少组件的个数，由此来减少h
阅读全文
摘要：与jQuery事件模块的其他事件不同，其他事件是通过数据缓存实现的，而初始化事件，jQuery.ready则是通过回调函数列表实现的。$()的参数如果是函数就向回调函数列表中添加回调函数，同时为DOMContentLoaded注册事件，在注册的事件处理函数中，触发resolve事件。 以下是对jQu
阅读全文
摘要：一、javascript中的属性、方法 1.首先，关于javascript中的函数/“方法”，说明两点： 1）如果访问的对象属性是一个函数，有些开发者容易认为该函数属于这个对象，因此把“属性访问”叫做“方法访问”，而实际上，函数永远不会属于一个对象，对象拥有的，只是函数的引用。确实，有些函数体内部使
阅读全文
浙公网安备 33010602011771号