![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
web前端
文章平均质量分 72
da宗熊
one喜欢自己乱搞idea的前端攻城狮
展开
-
chrome插件篇:资源监控01
因一些需求,前原创 2014-07-28 22:40:05 · 3946 阅读 · 1 评论 -
javascript编写自己的模板解析器
编写自己的模板解析器因为最近在研究artTemplate,ejs,baaiduTemplate等模板,所以,一时兴起,自己也写了个简单的模板解析器。一个最基本的模板解析器,需要有什么功能呢?读取变量值解析模板语句按照这个思路,我们编写一个简单的解析器,需求如下:读值: <%= 变量名 %>语句支持: <% if( type == 1 ){ %> good! <%}%>总体来说,就是如果模原创 2015-07-04 15:38:14 · 2193 阅读 · 0 评论 -
初识riot.js
初识MVP最近网上见到一个比较有趣的名词,而与之息息相关的,有一个叫riot.js的类库。它体积比想象中要小,但实现了类似angular.js、avalon.js这些流行前端框架的双向绑定,有强大路由器和事件系统。对jquery友好,能更好,更小的划分网站解构原创 2015-06-11 17:28:09 · 2973 阅读 · 0 评论 -
riot.js学习【七】脚本创建标签
创建标签在Riot中,我们通过html代码,创建自定义标签,但实际上,最终可运行的自定义标签,会被编译成脚本。实际上,一段这样的自定义标签代码:<script type="riot/tag"> <todo> <h1>{ title }</h1> this.title = opts.title || "da宗熊"; </todo></script>通过编原创 2015-06-15 14:07:23 · 1822 阅读 · 0 评论 -
数据验证【web前端,表单】
数据验证最近做后台比较多,路七八糟的数据验证,弄得不厌其烦。SO,弄了个表单验证的玩意出来,达到快速,简介,不烦人的验证。下面看看,几种方式的数据验证,有什么不同。原创 2015-07-17 19:51:59 · 4448 阅读 · 3 评论 -
数据模拟-mock.js
mock.js 数据模拟工作中,前端免不了需要和各种后台数据打交道。如果后端接口迟迟没提供,而又需要数据做展示或测试。而这时候,前端往往需要自己手动去模拟数据原创 2015-07-16 11:32:21 · 4211 阅读 · 1 评论 -
【web前端】可筛选[输入搜索]的select
基于jquery, 带筛选,可搜索的 select 插件。与 select 元素无缝结合,最大程度上,保证 select 的原生性。兼容 ie7 及 以上浏览器原创 2015-09-26 12:43:18 · 12717 阅读 · 0 评论 -
[入门]javascript正则表达式
正则表达式,又称正规表示法。它使用单个字符串来描述、匹配一系列符合某个规律的字符串。 在很多文本编辑器中,正则表达式用于检索、替换某些符合某种规则的文本。声明正则在 js 中,声明正则,有两种方式:new 方式var reg = new RegExp("\\d", "g"); // ===> /\d/g字面量定义var reg = /\d/g;正则 at 字符串在 js 中,字符串有两原创 2015-10-20 15:47:03 · 533 阅读 · 0 评论 -
模块加载器 project.js
功能简要说明项目地址: projectM模仿sea.js编写的脚本,只有 require 和 define 两个方法。 考虑到 sea.js 本身的 require,并不能加载样式、外部html结构等,所以,在此进行了改进,并提供了相关的解决方案。并不完全遵循 cmd 规范,为了满足 跨域 读取资源的需求,定义了额外的define规则。原创 2015-10-12 16:57:04 · 1230 阅读 · 0 评论 -
移动端实现简单的下拉刷新【web前端】
说明本文完全是个人学习,实现并不做过多的功能封装。实现原理依赖元素的 overflow-y: auto 的属性,实现滚动轴。通过改变 “刷新提醒”的元素的高度,达到下拉的效果。如图:例如,有如下的结构:<div id="wrap"> <!-- #pull-down为下拉加载更多的提醒 --> <div id="pull-down" class="pull-down">原创 2015-11-13 15:16:52 · 23825 阅读 · 2 评论 -
简单的刮刮乐源码
上周看到有同学,写了个刮刮乐的demo,但功能并不完善。 这里手痒,重新封装了一个。 支持成功的回调,修正滑动速度太快,掉帧的问题。 修正移动端,对canvas缩放后,坐标的偏差。AND 用canvas背景来放置奖励结果的图片,这个想法太赞了。<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewpor原创 2016-07-26 17:41:58 · 4927 阅读 · 0 评论 -
PipeValid.js 2.0 数据验证
PipeValid.js 2.0 版本,提供了快捷的数据验证方法。管道式验证,配置验证,自定义错误验证,随心所欲的错误返回。易用的验证表达式,能快速定位需验证数据。异步验证支持,再也不怕与后端交互,打断链式验证逻辑了。灵活验证单个或多个字段,多使用环境适配。原创 2016-07-18 21:52:59 · 3456 阅读 · 0 评论 -
[个人学习]另一个 Promise 对象
Thenable.js: another Promise项目的初衷,是抱着学习的目的,去了解、认识Promise的特性,顺路按照个人的习惯,改编了一份属于自己的 “Promise” 对象除了仿制了 Promise 大部分特性外,还添加了 整合 其他 promise/a 规范的小小功能,像 Promise 和 jQuery.Deferred 等,终于能愉快一起玩耍啦,有情人终成兄妹~~~项目地址初原创 2016-07-29 19:30:01 · 711 阅读 · 0 评论 -
jQuery页面下雪效果(支持IE7+,圣诞节专用
圣诞下雪效果,依赖jQuery,支持ie7以上的浏览器原创 2014-12-11 14:58:37 · 1318 阅读 · 1 评论 -
riot.js学习【六】杂烩2
构建方式Riot默认是通过”自定义标签”来构建DOM内容,但是也可以通过属性”riot-tag”,来指定使用哪种”自定义标签”来构建DOM。 如: <div riot-tag="todo" title="da宗熊"></div> 等同于: <todo title="da宗熊"></todo>或者,你也可以在 riot.mount 中,制定构建的元素:<div id="cont原创 2015-06-15 12:09:22 · 2029 阅读 · 0 评论 -
riot.js学习【三】事件
每个自定义标签从编译到构建,到最后的销毁,riot.js都提供了相应的事件。内置有4种事件:update在标签真正刷新UI前执行。它允许我们在更新UI前,改写context的数据updated在标签UI更新之后执行。这时候,我们可以对dom进行操作了mount在标签构建完成,放在页面后执行。unmount当标签从页面移除的时候执行。【一般是调用this.unmount()时执行】打个例子:原创 2015-06-12 11:36:10 · 3953 阅读 · 0 评论 -
Cocos2d-js 学习(四): DrawNode简单使用
cocos2d-js 学习,drawNode的简单使用原创 2014-12-16 11:45:16 · 6265 阅读 · 0 评论 -
Cocos2d-js 学习(一): cc.LabelTTF 简单API记录
最近在学习coco2d-js 3.0,因为之前没接触过,也很难找到齐全的文档,这里分享一下,希望能有大牛指点一下。可能有些小BUG,希望体谅并指点之~1、 创建var text = new cc.LabelTTF(“这是一段文字” [, 文字的配置, 大小] );EG:var text = new cc.LabelTTF(“哈哈,文字哦~”, "Arial",24);原创 2014-12-04 14:59:15 · 7346 阅读 · 0 评论 -
Cocos2d-js 学习(二): cc.Sprite 简单API记录
Cocos2d-js 3.0 学习,简单的cc.Sprite api小结原创 2014-12-04 15:03:38 · 6323 阅读 · 0 评论 -
Cocos2d-js 学习(三): 简单动画使用
1、 执行动画var sprite = new cc.Sprite(“图片地址..”);var action = cc. scaleBy(0.5, 0.5);sprite.runAction(action); // 动画执行一次 2、 动画无限执行action. repeatForever(); // 调用一下这个玩意,动画就能无限执行sprite.runActio原创 2014-12-04 15:06:56 · 5053 阅读 · 0 评论 -
Javascript 对象原型
Javascript原型对象原创 2015-03-02 11:14:38 · 603 阅读 · 0 评论 -
javascript继承学习(一)
模仿cocos2d-js,实现类继承。讲解如何实现优雅的链式类继承。原创 2015-04-08 09:39:03 · 1265 阅读 · 0 评论 -
grunt插架创建学习
不知道官网的同学,请访问这个链接:http://www.gruntjs.net/docs/creating-plugins/按照官网说的,就噼里啪啦的,敲了一大堆东西,大概流程如下:1、npm安装grunt插件模板 npm install -g grunt-init这里比较坑,我原本以为,只要npm命令后,模板神马的,就安装好了,结果还有下一步2、安装grunt插件模板原创 2015-04-02 20:32:49 · 665 阅读 · 0 评论 -
riot.js 学习【一】自定义标签
自定义标签Riot.js最强大的功能,莫过于自定义标签。这里说说信任可能遇到的坑。让你编写一个放心的自定义标签原创 2015-06-11 18:04:12 · 2499 阅读 · 2 评论 -
riot.js学习【二】mixin
Mixin 介绍riot.js中,有个重要的概念,就是mixin,顾名思义,大约的作用就是“混合”。把对象的属性、方法,混合进当前的context[上下文哈,俗点的理解,就是this对象原创 2015-06-11 20:37:15 · 2130 阅读 · 0 评论 -
riot.js学习【五】杂烩1
介绍Riot中,各种小知识,如简要的class,event对象,自定义括号,括号转移,内嵌HTML内容等原创 2015-06-12 23:58:31 · 1686 阅读 · 0 评论 -
riot.js学习【九】路由
Riot的路由系统,是基于hashChange的【锚点更改】。有两种监听锚点变化的方法: riot.route 和 riot.route.exec两者的区别如下: 1. exec只在页面加载后,执行一次,仅且一次 2. route页面加载后,不会自动执行 3. route只有锚点变化后,才会执行两者的用法一致,只是执行时机不一致。下面拿exec来举例默认的取值如下:// .../index.原创 2015-06-15 17:14:44 · 1704 阅读 · 0 评论 -
riot.js学习【四】表达式+Boolean属性
表达式在riot.js中,html标签,可使用比较强大的表达式,来设值。 表达式可用在 innerText, attributes 中,而且100%原汁原味的javascript语法。而针对Boolean的属性,也做了非常友爱的支持。原创 2015-06-12 22:53:41 · 1510 阅读 · 0 评论 -
riot.js学习【八】观察者
因为Riot是基于自定义标签【组件】开发的。标签内部的所有属性和方法,都是私有的,而外部要访问标签内容,就显得有些困难重重。如果愣是要访问标签里的内容,有几种吃力不讨好的方法:1、window全局变量法<script type="riot/tag"> <todo> <h1>{ title }</h1> this.title = opts.title || "da原创 2015-06-15 15:54:57 · 2560 阅读 · 0 评论 -
vue-router 页面切换动画
vue-router 页面切换动画网上一直没翻到 vue-router 翻页动画的完美实现,就心[bei]动[bi]的,编了一个简单的动画组件。支持简单的前进后退的左右动画,针对不支持 history.state 的浏览器,也能支持简单的透明动画。献上效果图:可下载此项目,打开 test.html,点击浏览器的前进、后退按钮,观看具体效果。项目地址使用使用前,请确保项目内,已经使用了 vue-loa原创 2018-01-22 19:34:42 · 6105 阅读 · 0 评论