博客园 - 北磬
uuid:24b78886-0ed1-41c2-8670-e3f31dcf42c4;id=135258
2019-01-09T05:36:19Z
北磬
https://www.cnblogs.com/langzs/
feed.cnblogs.com
https://www.cnblogs.com/langzs/p/6758992.html
javascript中类式继承和原型式继承的实现方法和区别 - 北磬
在所有面向对象的编程中,继承是一个重要的话题。一般说来,在设计类的时候,我们希望能减少重复性的代码,并且尽量弱化对象间的耦合(让一个类继承另一个类可能会导致二者产生强耦合)。关于“解耦”是程序设计中另一个重要的话题,本篇重点来看看在javascript如何实现继承。 其它的面向对象程序设计语言都是通
2017-04-24T12:47:00Z
2017-04-24T12:47:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】在所有面向对象的编程中,继承是一个重要的话题。一般说来,在设计类的时候,我们希望能减少重复性的代码,并且尽量弱化对象间的耦合(让一个类继承另一个类可能会导致二者产生强耦合)。关于“解耦”是程序设计中另一个重要的话题,本篇重点来看看在javascript如何实现继承。 其它的面向对象程序设计语言都是通 <a href="https://www.cnblogs.com/langzs/p/6758992.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/p/6719618.html
为博客园文章中插入的代码片段加一个运行按钮 - 北磬
博客园里大家都分享了很多的有用知识,看到好的代码,总想拿到手上去试一下,然后慢慢体会!如果是展示一段完整能运行的代码,若能给读者提供一个【运行代码】的按钮,就方便多了!前两天开通了博客园的JS权限(发邮件到contact@cnblogs.com可以申请开通),今天先拿这个试了一下手,先来体验一把吧:
2017-04-16T11:18:00Z
2017-04-16T11:18:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】博客园里大家都分享了很多的有用知识,看到好的代码,总想拿到手上去试一下,然后慢慢体会!如果是展示一段完整能运行的代码,若能给读者提供一个【运行代码】的按钮,就方便多了!前两天开通了博客园的JS权限(发邮件到contact@cnblogs.com可以申请开通),今天先拿这个试了一下手,先来体验一把吧: <a href="https://www.cnblogs.com/langzs/p/6719618.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/p/6710014.html
给我的cnblogs主页做一个响应式布局模板 - 北磬
在cnblogs,一直都是使用官方自带的那些模板,而且感觉也一直很良好!不过最近用手机搜索一些相关的技术资料,很多都来自cnblogs,有些博主的页面在和机端显得很好,有些则展示得不那么友好了……忽然想起了cnblogs可以完全自定义CSS,早上起来就开始整了。由于我一直都喜欢干净整洁且清晰的页面,
2017-04-14T09:40:00Z
2017-04-14T09:40:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】在cnblogs,一直都是使用官方自带的那些模板,而且感觉也一直很良好!不过最近用手机搜索一些相关的技术资料,很多都来自cnblogs,有些博主的页面在和机端显得很好,有些则展示得不那么友好了……忽然想起了cnblogs可以完全自定义CSS,早上起来就开始整了。由于我一直都喜欢干净整洁且清晰的页面, <a href="https://www.cnblogs.com/langzs/p/6710014.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/p/6698879.html
关于引用iframe的一点小说明 - 北磬
有时候,在web页面中使用iframe,可以解决一些实际问题,比如跨域访问等……这篇文章的关键不是iframe适用于哪些场景?而是iframe间如何进行互通?所谓互通是指: 情况1:在任何一个页面中调用其它页面的方法或数据(比如:在frameb.html中调用index.html中的sayHello
2017-04-12T05:59:00Z
2017-04-12T05:59:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】有时候,在web页面中使用iframe,可以解决一些实际问题,比如跨域访问等……这篇文章的关键不是iframe适用于哪些场景?而是iframe间如何进行互通?所谓互通是指: 情况1:在任何一个页面中调用其它页面的方法或数据(比如:在frameb.html中调用index.html中的sayHello <a href="https://www.cnblogs.com/langzs/p/6698879.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/p/6684282.html
鼠标滚动:mousewheel事件在Firefox采用DOMMouseScroll事件的统一处理 - 北磬
这是一个小事件,但当下的WEB应用交互非常丰富,判断鼠标的滚动来执行相应的操作是比较常见的。我用Chrome/IE/Firefox/Opera 4种浏览器做测试,发现只有firefox的处理方法有很大的不同,下面细说一下这个情况: 第1、事件的名称不同 其它浏览器均采用mousewheel做为事件的
2017-04-09T04:50:00Z
2017-04-09T04:50:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】这是一个小事件,但当下的WEB应用交互非常丰富,判断鼠标的滚动来执行相应的操作是比较常见的。我用Chrome/IE/Firefox/Opera 4种浏览器做测试,发现只有firefox的处理方法有很大的不同,下面细说一下这个情况: 第1、事件的名称不同 其它浏览器均采用mousewheel做为事件的 <a href="https://www.cnblogs.com/langzs/p/6684282.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/p/6637703.html
实现如下语法的功能:var a = add(2)(3)(4); //9 - 北磬
从汤姆大叔的博客里看到了6个基础题目:本篇是第6题 - 实现如下语法的功能:var a = add(2)(3)(4); //9 解题关键:add()函数需要返回一个加法函数,而不是一个普通的值,即定义add(),并想办法让add()返回一个add()。js最显著的特征就是函数的返回值可以是一个函数。
2017-03-28T16:04:00Z
2017-03-28T16:04:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】从汤姆大叔的博客里看到了6个基础题目:本篇是第6题 - 实现如下语法的功能:var a = add(2)(3)(4); //9 解题关键:add()函数需要返回一个加法函数,而不是一个普通的值,即定义add(),并想办法让add()返回一个add()。js最显著的特征就是函数的返回值可以是一个函数。 <a href="https://www.cnblogs.com/langzs/p/6637703.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/p/6637614.html
实现如下语法的功能:var a = (5).plus(3).minus(6); //2 - 北磬
从汤姆大叔的博客里看到了6个基础题目:本篇是第5题 - 实现如下语法的功能:var a = (5).plus(3).minus(6); //2 解题关键: 1、理解使用(5)和5的区别 2、构造函数原型的扩展(Object.prototype) 解点1:理解使用(5)和5的区别 (5)是一个表达式,
2017-03-28T15:29:00Z
2017-03-28T15:29:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】从汤姆大叔的博客里看到了6个基础题目:本篇是第5题 - 实现如下语法的功能:var a = (5).plus(3).minus(6); //2 解题关键: 1、理解使用(5)和5的区别 2、构造函数原型的扩展(Object.prototype) 解点1:理解使用(5)和5的区别 (5)是一个表达式, <a href="https://www.cnblogs.com/langzs/p/6637614.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/p/6637547.html
利用JavaScript打印出Fibonacci数(不使用全局变量) - 北磬
从汤姆大叔的博客里看到了6个基础题目:本篇是第4题 - 利用JavaScript打印出Fibonacci数(不使用全局变量) 解题关键: 1、Fibonacci数列的规律 2、递归 解点1:Fibonacci数列的规律 解点2:递归 递归是一个复杂的概念,此题可以不用递归解决,但题目要求不能使用全局
2017-03-28T15:09:00Z
2017-03-28T15:09:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】从汤姆大叔的博客里看到了6个基础题目:本篇是第4题 - 利用JavaScript打印出Fibonacci数(不使用全局变量) 解题关键: 1、Fibonacci数列的规律 2、递归 解点1:Fibonacci数列的规律 解点2:递归 递归是一个复杂的概念,此题可以不用递归解决,但题目要求不能使用全局 <a href="https://www.cnblogs.com/langzs/p/6637547.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/p/6637471.html
给object数组进行排序(排序条件是每个元素对象的属性个数) - 北磬
从汤姆大叔的博客里看到了6个基础题目:本篇是第3题 - 给object数组进行排序(排序条件是每个元素对象的属性个数) 解题关键: 1、Array.sort的用法 2、object的属性数量的统计 解点1:Array.sort的用法 Array.sort可以为数组指定一个排序规则,一般用如下格式进行
2017-03-28T14:53:00Z
2017-03-28T14:53:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】从汤姆大叔的博客里看到了6个基础题目:本篇是第3题 - 给object数组进行排序(排序条件是每个元素对象的属性个数) 解题关键: 1、Array.sort的用法 2、object的属性数量的统计 解点1:Array.sort的用法 Array.sort可以为数组指定一个排序规则,一般用如下格式进行 <a href="https://www.cnblogs.com/langzs/p/6637471.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/p/6637264.html
转化一个数字数组为function数组(每个function都弹出相应的数字) - 北磬
从汤姆大叔的博客里看到了6个基础题目:本篇是第2题 - 转化一个数字数组为function数组(每个function都弹出相应的数字) 此题关键点: 1、如何将一个匿名函数存入数组? 2、如何锁住需要调用的值? 解点1:如何将一个匿名函数存入数组? 如上,arr[0]即为一个函数,可用arr[0](
2017-03-28T14:35:00Z
2017-03-28T14:35:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】从汤姆大叔的博客里看到了6个基础题目:本篇是第2题 - 转化一个数字数组为function数组(每个function都弹出相应的数字) 此题关键点: 1、如何将一个匿名函数存入数组? 2、如何锁住需要调用的值? 解点1:如何将一个匿名函数存入数组? 如上,arr[0]即为一个函数,可用arr[0]( <a href="https://www.cnblogs.com/langzs/p/6637264.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/p/6637033.html
找出数字数组中最大的元素(使用Math.max函数) - 北磬
从汤姆大叔的博客里看到了6个基础题目:本篇是第1题 - 找出数字数组中最大的元素(使用Match.max函数) 从要求上来看,不能将数组sort、不能遍历。只能使用Math.max,所以只能从javascript的特征和本质方面着手。 分析:查找列表是一个数组,那么意味着我们要传入一个数组参数给Ma
2017-03-28T13:45:00Z
2017-03-28T13:45:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】从汤姆大叔的博客里看到了6个基础题目:本篇是第1题 - 找出数字数组中最大的元素(使用Match.max函数) 从要求上来看,不能将数组sort、不能遍历。只能使用Math.max,所以只能从javascript的特征和本质方面着手。 分析:查找列表是一个数组,那么意味着我们要传入一个数组参数给Ma <a href="https://www.cnblogs.com/langzs/p/6637033.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/archive/2013/01/27/taobaoshuangfeiyi.html
CSS布局之--淘宝双飞翼布局 - 北磬
淘宝的页面布局中,最经典的应该是它的 【子列】 【主列】 【附加列】这三个概念。通过查看淘宝店铺页面的DOM结构及其CSS可以发现:淘宝使用的左中右三列布局采用的方式与我们平常有很大差别。一般我们是下面这种做法:<div class="sub">子列</div><div class="main">主列</div><div class="extra">附加列</div>然后,对于sub main extra 分别设置宽度为190 550 190及float:left
2013-01-26T17:55:00Z
2013-01-26T17:55:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】淘宝的页面布局中,最经典的应该是它的 【子列】 【主列】 【附加列】这三个概念。通过查看淘宝店铺页面的DOM结构及其CSS可以发现:淘宝使用的左中右三列布局采用的方式与我们平常有很大差别。一般我们是下面这种做法:<div class="sub">子列</div><div class="main">主列</div><div class="extra">附加列</div>然后,对于sub main extra 分别设置宽度为190 550 190及float:left <a href="https://www.cnblogs.com/langzs/archive/2013/01/27/taobaoshuangfeiyi.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/archive/2011/04/11/2012150.html
节点类型常量表(DOM) - 北磬
做一个记录!就这样了。
2011-04-11T02:22:00Z
2011-04-11T02:22:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】做一个记录!就这样了。 <a href="https://www.cnblogs.com/langzs/archive/2011/04/11/2012150.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/archive/2011/04/10/2011155.html
事件绑定之bindEvent()与 unBindEvent()函数 - 北磬
前面我写过一个一个特殊的事件绑定程序(通用于各种浏览器)不过,此函数只实现了事件的绑定,并保证按顺序执行这些绑定的函数。但是,不能实现元素的某个事件上删除一个函数。比如:element元素的click事件上有三个函数分别是a,b,c。现在要删除c这个函数的绑定,就无法实现了。所以特重新编写了两个函数:bindEvent(element, eventName, func) —— 绑定func到element的eventName事件上(不重复绑定)unBindEvent(element, eventName, func) —— 删除element上的eventName事件上的func函数。下面是这
2011-04-10T02:30:00Z
2011-04-10T02:30:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】前面我写过一个一个特殊的事件绑定程序(通用于各种浏览器)不过,此函数只实现了事件的绑定,并保证按顺序执行这些绑定的函数。但是,不能实现元素的某个事件上删除一个函数。比如:element元素的click事件上有三个函数分别是a,b,c。现在要删除c这个函数的绑定,就无法实现了。所以特重新编写了两个函数:bindEvent(element, eventName, func) —— 绑定func到element的eventName事件上(不重复绑定)unBindEvent(element, eventName, func) —— 删除element上的eventName事件上的func函数。下面是这 <a href="https://www.cnblogs.com/langzs/archive/2011/04/10/2011155.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/archive/2011/04/06/2007100.html
javascript正则表达式(二) - 北磬
首先,请复习javascript正则表达式(一)本节的内容比较简单,主要包含”转义字符、匹配选项、量词“三个部分。下面步入正题。第一、转义字符* ? . 等一些符号在正则表达式中都具有特殊的函义,如果我们要匹配一个*号时,怎么办呢?比如我们要看一个字符串s是否含有*号,应该使用如下方式:var s = "Hello, here is *";// var reg = /*/; [*表示前面的内容重复0到多次,这样写会出错]var reg = /\*/;document.write (reg.test(s)); //结果为true我们应该将*改用 \* 的形式。同样你就明白了
2011-04-06T10:07:00Z
2011-04-06T10:07:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】首先,请复习javascript正则表达式(一)本节的内容比较简单,主要包含”转义字符、匹配选项、量词“三个部分。下面步入正题。第一、转义字符* ? . 等一些符号在正则表达式中都具有特殊的函义,如果我们要匹配一个*号时,怎么办呢?比如我们要看一个字符串s是否含有*号,应该使用如下方式:var s = "Hello, here is *";// var reg = /*/; [*表示前面的内容重复0到多次,这样写会出错]var reg = /\*/;document.write (reg.test(s)); //结果为true我们应该将*改用 \* 的形式。同样你就明白了 <a href="https://www.cnblogs.com/langzs/archive/2011/04/06/2007100.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/archive/2011/04/06/2006820.html
javascript正则表达式(一) - 北磬
正则表达式一般用于描述一个复杂字符串的组成规则。比如我们平常指定一个电话号码时,可以用许多种方式来表示:1)区号可以是3位或4位2)区号可以加上(),如:(010)3)区号和电话号之间可以用 - 分隔,也可以不分隔4)后面的电话号可以是7位或8位5)不能包含上面提到的其它符号具体的例子有:0739 - 8711100 或 07398711100 或(0739)8711100或(0739)-8711100……等等!当我们需要检测某个电话号码的格式是否正确时,我们就应该遵循上面的规则进行判断。上面的这些规则如果我们用程序来做检测也是可以的只要你愿意用那些复杂的方式。但如果使用正则表达式来定义其规则
2011-04-06T06:54:00Z
2011-04-06T06:54:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】正则表达式一般用于描述一个复杂字符串的组成规则。比如我们平常指定一个电话号码时,可以用许多种方式来表示:1)区号可以是3位或4位2)区号可以加上(),如:(010)3)区号和电话号之间可以用 - 分隔,也可以不分隔4)后面的电话号可以是7位或8位5)不能包含上面提到的其它符号具体的例子有:0739 - 8711100 或 07398711100 或(0739)8711100或(0739)-8711100……等等!当我们需要检测某个电话号码的格式是否正确时,我们就应该遵循上面的规则进行判断。上面的这些规则如果我们用程序来做检测也是可以的只要你愿意用那些复杂的方式。但如果使用正则表达式来定义其规则 <a href="https://www.cnblogs.com/langzs/archive/2011/04/06/2006820.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/archive/2011/04/05/2006208.html
一个特殊的事件绑定程序(通用于各种浏览器) - 北磬
做前端,事件绑定是一个关键!全球比较有名的事件绑定程序也比较多,而且在网络广为流传。也不得不承认那些程序是写的不错。今天我自己也写了一个,就目前形式来看,它具有以下特点:1、同元素的同事件可以绑定多个函数。2、解决了this的问题,也是说在绑定函数体内的this指向的是元素。3、被绑定的那些函数总是按顺序执行的。4、简单容易理解,完全无视addEventListener和attachEvent之类的东西。5、在firefox、IE、opera、safari、chrome下工作良好下面是代码:function addEvent(obj, type, fn) { var func = obj[&#
2011-04-05T15:04:00Z
2011-04-05T15:04:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】做前端,事件绑定是一个关键!全球比较有名的事件绑定程序也比较多,而且在网络广为流传。也不得不承认那些程序是写的不错。今天我自己也写了一个,就目前形式来看,它具有以下特点:1、同元素的同事件可以绑定多个函数。2、解决了this的问题,也是说在绑定函数体内的this指向的是元素。3、被绑定的那些函数总是按顺序执行的。4、简单容易理解,完全无视addEventListener和attachEvent之类的东西。5、在firefox、IE、opera、safari、chrome下工作良好下面是代码:function addEvent(obj, type, fn) { var func = obj[&# <a href="https://www.cnblogs.com/langzs/archive/2011/04/05/2006208.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/archive/2011/04/05/2005821.html
javascript的渐进增强与平稳退化 - 北磬
在google.com.hk的左上角,有一个更多的链接,它具有一个目标地址,但是当我们点击时,大多数情况发现的是弹出一个下拉列表供用户选择(这是一种典型的渐进增强形式)。怎么理解?——如果用户的浏览器支持javascript,那么就可以享受到这种快速导航的服务功能。现在,请你禁用的你的浏览器的javascript功能(不会禁用猛击这里),再次访问google.com.hk,再次点击更多时,发生了什么?是的,没有看到下拉列表,而打开了一个新页面。(这是一种典型的平稳退化)。怎么理解?——如果用户的浏览器不支持javascript,用户仍然能够访问我的网站。如何实现类似google的这一功能?1
2011-04-05T06:43:00Z
2011-04-05T06:43:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】在google.com.hk的左上角,有一个更多的链接,它具有一个目标地址,但是当我们点击时,大多数情况发现的是弹出一个下拉列表供用户选择(这是一种典型的渐进增强形式)。怎么理解?——如果用户的浏览器支持javascript,那么就可以享受到这种快速导航的服务功能。现在,请你禁用的你的浏览器的javascript功能(不会禁用猛击这里),再次访问google.com.hk,再次点击更多时,发生了什么?是的,没有看到下拉列表,而打开了一个新页面。(这是一种典型的平稳退化)。怎么理解?——如果用户的浏览器不支持javascript,用户仍然能够访问我的网站。如何实现类似google的这一功能?1 <a href="https://www.cnblogs.com/langzs/archive/2011/04/05/2005821.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/archive/2011/01/01/1923858.html
如何阻止javascript事件冒泡? - 北磬
记录:function stopBubble( e ) { if(e && e.stopPropagation) { e.stopPropagation(); } //标准模式 else { window.event.cancelBubble = true; } //IE模式}问题:好像这阻止冒泡并不是很适用。转载请注明:转载自web前端开发
2011-01-01T12:06:00Z
2011-01-01T12:06:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】记录:function stopBubble( e ) { if(e && e.stopPropagation) { e.stopPropagation(); } //标准模式 else { window.event.cancelBubble = true; } //IE模式}问题:好像这阻止冒泡并不是很适用。转载请注明:转载自web前端开发 <a href="https://www.cnblogs.com/langzs/archive/2011/01/01/1923858.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/langzs/archive/2010/12/31/1923397.html
关于Mozilla浏览器不支持innerText的解决办法 - 北磬
在各大浏览器中,除Mozilla浏览器外,几乎都支持一个元素的属性:innerText。我们可以通过它来快速获取某个元素的内的文本。比如:<p id="test"><strong><font color="red">Hello</font> , world!</strong></p>我们使用代码:alert((document.getElementById("test")).innerText)在IE、Chrome中,均能获取到“Hello , world!”,但
2010-12-31T11:13:00Z
2010-12-31T11:13:00Z
北磬
https://www.cnblogs.com/langzs/
【摘要】在各大浏览器中,除Mozilla浏览器外,几乎都支持一个元素的属性:innerText。我们可以通过它来快速获取某个元素的内的文本。比如:<p id="test"><strong><font color="red">Hello</font> , world!</strong></p>我们使用代码:alert((document.getElementById("test")).innerText)在IE、Chrome中,均能获取到“Hello , world!”,但 <a href="https://www.cnblogs.com/langzs/archive/2010/12/31/1923397.html" target="_blank">阅读全文</a>