我的前端工具集(七)div背景网格   liuyuhang原创,未经允许禁止转载 目录 我的前端工具集 有时候总觉得div颜色过于白,于是给了10%的灰 但是并不一定能解决问题,因为页面中会有不均衡的空白处,导致大面积灰有些暗淡 于是想给div背景加上网格 1.css代码 .gridbackground { /*网格背景*/ /*90度直线,100灰度,0.1透明度,5%宽度,0透明度背景*/ background: linear-gradient(90deg, rgba(100, 100, 1…
我的前端工具集(六)Ajax封装token   liuyuhang原创,未经允许禁止转载 在单点登陆中,或登陆验证后,不应该每次都验证用户名和密码, 也不应该将用户名密码存入cookie中(虽然很多都这么做) token作为一种验证策略,实现起来比较简单,也可以找一些单点登陆的框架,或者token解决方案. 本文工具使用REST风格,将ajax经过简单封装,使得所有使用此封装后的ajax都默认进行token验证. 1.封装的ajax代码 /** * 封装ajax代码 */ var local =…
我的前端工具集(八)获得html元素在页面中的位置   liuyuhang原创,未经允许禁止转载 目录 我的前端工具集 有时候需要用点击等操作,来获取某元素在页面中的位置,然后在该位置添加某些操作 如进度条,提示框,特效动画等.(bootstrap提示工具也挺好用的). 1.html代码 <div style="padding:10px"> <h2>This is a page to test Postion.</h2> <div id=&qu…
摘要:一款基于Vue组合式API的函数工具集. 本文分享自华为云社区<vueuse:我不许身为vuer的前端,你的工具集只有lodash!>,作者: 前端要摸鱼 . vueuse 是什么? 一款基于Vue组合式API的函数工具集. 以上是官方网站关于它的定义. 首先,它基于Vue Composition Api (组合式API),只有在支持组合式API的环境下,才可以正常使用它:什么是组合式API? 然后,它是一款函数工具集(可类比为lodash.js/ramda.js); 简单来说,这是一个…
请注意,这是一篇站在完全新手的角度上来写的文章.可能你是一个后端人员想了解前端工具的使用和概念;也可能你是一个前端小菜(还在DIV+CSS的世界里挣扎着).本文比较适合那些以前完全没有接触过WebPack,而又想使用的朋友.通过本文你能理解webPack工作原理及做用!(不会至于看了半天资料还没有头绪!) 前言:本人是一个从后端转向前端的程序猿,在此之前对于前端的印象一直是:HTML + CSS + JS.完全没有想过前端会发展的如此的迅速,各种名词的出现:Node.NPM.Grunt.Gulp…
客户端验证在任何项目都是不够的,因为 JavaScript 可以直接忽略,人们可以提交请求到服务器. 然而这并不意味着客户端验证都没必要了,很多时候我们需要在用户提交到服务器之前给予提示.JavaScript 表单验证库允许开发人员自定义样式.错误消息和样式以及简化验证规则的创建. 在本文中,您将找到最好的15个 JavaScript 表单验证库,可以帮助你让表单验证对用户更友好的和美观. 您可能感兴趣的相关文章 网站开发中很有用的 jQuery 效果[附源码] 分享35个让人惊讶的 CSS3…
最近微软发布了一本白皮书,谈到了一些可以和Visual Studio 2015和ASP.NET 5配合使用的JS/前端Web开发工具(比如:函数库.任务执行器.框架等). 由于现在前端开发的生态系统在快速增长,也变得越来越复杂和庞大.所以,微软特意发布了这么一个白皮书来讲解一些可以集成到VS 2015用于ASP.NET 5开发的前端工具库.这些前端工具库,都能很好的被VS2015所支持,比如提供智能提示等内置特性. 每个涉及的工具库都给出了入门介绍.基本概念,以及在VS和ASP.NET中的用法.…
原来用 backbone 的时候, 感觉 underscore 是一个好的工具集,顿时感觉不错,不用自己一直去封装一些组件. 直到我遇到了 lodash,一只发现 web 项目中有依赖这个库的,但是一直没有注意是干什么的. 项目中还有很多自己封装的工具(看样子本公司框架人员也不是很清楚这个 -_-) 地址如下: http://lodashjs.com/  github地址也跟上 lodash 仅做下记录,表示重视.相信很多人会用到.…
接上一篇的内容继续来说,背景篇的内容主要是介绍web前端工具的出现的原因和当前主要JavaScript模块化编程的几种规范!这篇内容主要介绍webpack的初级使用! 注意:目前webpack分为两个版本:1.x 和2.x这两个版的对应配置方式也是不一样的,我目前只使用过1.X的版本.下面例子中所有配置的都是1.x的 这里先上一张webpack官方的图 官方对于webpack的解释:webpack is a module bundler(webpack就是一个模块打包机).它就是分析你当前项目的…
随着CSS3的出现,CSS3讨论的话题越来越多了,现在各种教程也是多如牛毛,不比一年前的时候,找个资料要捞遍整个互联网,而且还很难找到自己需要的参考资料.从侧面也说明,CSS3对于前端工程师来说,越来越重要了,从各处的招聘信息也能看出这一点.说这么说我想强调的是他的重要性.另一方面,有很多CSS3的效果真的不需我们自己一个一个去写,在这种情况就互联网上有关于CSS3的工具就出现了,这些工具将给你的制作节省很多时间,让你有更多的时间去做自己想要做的事情. SVG Edit SVG EDIT是一款在…