代码改变世界

随笔分类 - javascript

实现一个类 Vue 的 MVVM 框架

2017-01-22 16:27 by 飞魚, 1005 阅读, 收藏, 编辑
摘要: Vue 一个 MVVM 框架、一个响应式的组件系统,通过把页面抽象成一个个组件来增加复用性、降低复杂性 主要特色就是数据操纵视图变化,一旦数据变化自动更新所有关联组件~ 所以它的一大特性就是一个数据响应系统,当然有了数据还需要一个模板解析系统 即 HTMLParse 帮我们把数据模板生成最终的页面, 阅读全文

教你一步一步实现一个Promise

2014-05-19 09:53 by 飞魚, 2532 阅读, 收藏, 编辑
摘要: Promise我想现在大家都非常熟悉了,主要作用就是解决异步回调问题,这里简单介绍下。Promise规范是CommonJS规范之一,而Promise规范又分了好多种,比如 Promises/A、Promises/B、Promises/Kiss等等有兴趣的可以到这多了解一些http://wiki.co... 阅读全文

jquery1.8.3 callbacks源码分析

2012-12-04 09:49 by 飞魚, 1028 阅读, 收藏, 编辑
摘要: 先附上源码如下var optionsCache = {};//缓存optionsfunction createOptions( options ) { //接受字符串参数,如 传入"unique memory" var object = optionsCache[ options ] = ... 阅读全文

JavaScript库 Sparrow v0.1.2发布,一个类miniJQ的lib

2012-08-14 09:55 by 飞魚, 1347 阅读, 收藏, 编辑
摘要: 关于Sparrow更多的介绍可查看上次Sparrow v0.1.1版本,本次更新有了如下增强.... 选择器部分 增加了parent,children,prev,next,siblings等常用方法 异步方面 增加了load方法加载js,css文件,loadJsonp方法跨域请求数据,同时还内置了一 阅读全文

JavaScript库 Sparrow v0.1.1发布,一个类miniJQ的lib

2012-07-31 23:41 by 飞魚, 510 阅读, 收藏, 编辑
摘要: 零零碎碎的折腾俩个礼拜终于算是完成了这个lib,名为Sparrow(麻雀),目前压缩版15k,虽没jq那么强大,但正如其名五脏俱全,一般的应用都能应付了....Sparrow参考了网上的一些文章及其他js框架,如果涉及版权问题请及时告知,以便处理...至于这个lib的特点一个类miniJQ的库大家应该都明白的差不多了...(神马跨浏览器啊,链式调用啊,write less do more等)下面看看它到底都能干什么 Sparrow以S或$命名调用,首先就是熟悉的DomReadyS(function(){ ....});其次是简单的选择器支持#id,#id tag,#id .cls,tag,.. 阅读全文

生成tree/menu结构

2012-05-14 23:27 by 飞魚, 193 阅读, 收藏, 编辑
摘要: 参考ztreehttp://www.baby666.cn/v3/main.php#_zTreeInfo<!DOCTYPE html><head> <title></title></head><body> <ul id="test"> </ul> <script src="jquery-1.6.4.js" type="text/javascript"></script> <script type="te 阅读全文

requirejs小记

2012-04-01 21:53 by 飞魚, 2375 阅读, 收藏, 编辑
摘要: require.js是一个模块加载器,用在javascript的环境中,实现模块化开发...惯例演示demo...总体结构图demo.html<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title& 阅读全文

backbone入门

2012-03-30 18:04 by 飞魚, 2899 阅读, 收藏, 编辑
摘要: backbone是一个前端mvc的框架,虽说出来有段时间了,但直到最近才开始学习下,并写了个demo帮助新手入门...本demo配合seajs开发(一个模块加载器,这里写了篇seajs小记说明如何使用seajs)...demo结构图demo.htm backbone ... 阅读全文

seajs小记

2012-03-26 16:51 by 飞魚, 1008 阅读, 收藏, 编辑
摘要: 写一个小demo加深印象...运行结果图,demo总体结构图,seajs.htm <!doctype html><html><head> <title>seajs-demo</title> <script src="js/lib/sea.js" data-main="./js/init" type="text/javascript"></script></head><body> <div id="page&quo 阅读全文

深入理解JavaScript定时机制

2011-11-09 14:49 by 飞魚, 155 阅读, 收藏, 编辑
摘要: 本文地址:http://www.laruence.com/2009/09/23/1089.html转载文章转帖地址:http://www.9demo.com/archives/341容易欺骗别人感情的JavaScript定时器JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不少人都深有同感, 例如setTimeout(function() { alert('你好!');}, 0);setInterval(callbackFunction, 100);认为setTimeout中 阅读全文

Firebug控制台详解

2011-11-09 14:36 by 飞魚, 163 阅读, 收藏, 编辑
摘要: 原为链接http://www.ruanyifeng.com/blog/2011/03/firebug_console_tutorial.htmlFirebug是网页开发的利器,能够极大地提升工作效率。但是,它不太容易上手。我曾经翻译过一篇《Firebug入门指南》,介绍了一些基本用法。今天,继续介绍它的高级用法。===================================Firebug控制台详解作者:阮一峰控制台(Console)是Firebug的第一个面板,也是最重要的面板,主要作用是显示网页加载过程中产生各类信息。一、显示信息的命令Firebug内置一个console对象,提供5 阅读全文

js正则表达式

2011-11-09 14:26 by 飞魚, 205 阅读, 收藏, 编辑
摘要: 什么是正则表达式?这个问题可以参见:“正则表达式30分钟入门教程”,很多编程语言都支持正则表达式,本文仅仅讨论JavaScript中的正则表达式。创建一个正则表达式第一种方法:var reg = /pattern/;第二种方法:var reg = new RegExp('pattern');正则表达式的exec方法简介语法:reg.exec(str);其中str为要执行正则表达式的目标字符串。例如:<script type="text/javascript">var reg = /test/;var str = 'testString&# 阅读全文

不可不知的JavaScript运算符优先级

2011-11-09 14:00 by 飞魚, 1591 阅读, 收藏, 编辑
摘要: 相同优先级顺序执行1vara = 1 && 2 && 3// 3,1 && 2 1为真返回2;2 || 3, 2为真返回3 ;2varb = 1 || 2 || 3// 1 ,1 || 2 1为真返回1;1 || 3 ,1为真返回1;“&&” 寻找false。例如: a && b ,如果 a 为true,直接返回b,而不管b为true或者false 。“||” 寻找true。 与&&同理,例如:a || b ,如果 a 为false,直接返回b,而不管b为true或者false 。像 &&a 阅读全文

javascript 获取元素计算后的样式及删除style中指定的样式属性

2011-07-16 13:17 by 飞魚, 1556 阅读, 收藏, 编辑
摘要: <style> #mytest { width: 100px; height: 100px; border: 1px solid blue; }</style><div id="mytest" style="color: red; border: 1px solid red;"></div><script type="text/javascript">// <![CDATA[ var div = document.getElementById("mytest& 阅读全文

javascript instanceof、isPrototypeOf、hasOwnProperty、in的使用

2011-07-07 14:11 by 飞魚, 1060 阅读, 收藏, 编辑
摘要: <script type="text/javascript"><!-- function Person() { this.name = "ygm"; } var p = new Person(); alert("对象p属于Object类型:" + (p instanceof Object)); alert("对象p属于Person类型:" + (p instanceof Person)); alert("对象p的原型链中是否存在指定类型的原型:" + Person.protot 阅读全文

javascript中万恶的function

2011-05-18 21:49 by 飞魚, 2055 阅读, 收藏, 编辑
摘要: javascript中最有特色而又让你困惑的function算一个了下面看一下常用操作 function doit(){ ..... } doit();javascript中的函数我们可以把它当作方法使用 var obj=new Object(); obj.say=function(){ ..... } obj.say();而function实际上就是对象(即Function类型的实例) function result(num1, num2) { return num1 + num2; } var result = new Function("num1", "nu 阅读全文

javascript caller callee的使用

2011-04-23 12:31 by 飞魚, 313 阅读, 收藏, 编辑
摘要: 上网的时候经常看到这俩个属性,一直也没有看下是干什么用的,今天正好看了下文章,了解了下并做个记录..1、caller返回一个对函数的引用,该函数调用了当前函数function callerDemo() { if (callerDemo.caller) { alert(callerDemo.caller); } else { alert("this is a top function"); } } function handleCaller() { callerDemo(); } caller是Function对象的一个属性,从结果可以看出它返回一个调用当前函数的函数的源代码 阅读全文

原生js方式实现ajax,并仿jquery方式简单调用

2011-04-22 18:35 by 飞魚, 618 阅读, 收藏, 编辑
摘要: 以下为下效果图和实现代码 注:此demo要在.net环境下运行ajax.js代码:var $ = {}; $.xho = function () { //创建xmlhttprequest对象 var http_request = null; if (window.XMLHttpRequest) { //Mozilla 浏览器 http_request = new XMLHttpRequest(); if (http_request.overrideMimeType) {//设置MIME类别 http_request.overrideMimeType("text/xml"); 阅读全文

在自己网页中嵌入google、baidu等搜索引擎

2011-04-21 11:30 by 飞魚, 1582 阅读, 收藏, 编辑
摘要: 有的时候需要在自己的网站中,添加google等搜索引擎方便用户查询,以下为实现的效果截图及js代码,文章暂不考虑样式美观问题...<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>< 阅读全文