代码改变世界

随笔分类 -  javascript基础

【javascript基础】之深度克隆(深度拷贝)一个对象

2012-11-19 22:29 by sniper007, 337 阅读, 收藏, 编辑
摘要: 【题记】JavaScript深度克隆(深度拷贝)一个对象 http://www.css88.com/archives/4818 看到这篇文章,愚人码头方法还行,但总觉得缺少了什么,如果参数是伪数组的时候,比如childNodes,获取的是NodeList,是一个伪数组,用Array.prototype.slice.call(obj, 0)会报错,因为IE8以及更早的版本将NodeList以COM对象形式实现的。我的代码如下:1functionisArray(obj){2returnObject.prototype.toString.call(obj)==='[objectArray]& 阅读全文

【javascript基础】cc_on的详解

2012-11-19 18:59 by sniper007, 575 阅读, 收藏, 编辑
摘要: 一、基本概念 条件编译仅在 Internet Explorer 中受支持,其他浏览器不支持。很简单,代码放到如下的标签中,即可运行1/*@cc_on2 doStuff();3@*/下面是官方的例子 DEMO:1/*@cc_on@*/2/*@3document.write("JavaScriptversion:"+@_jscript_version+".");4document.write("<br/>");5@if(@_win32)6document.write("Runningonthe32-bitversio 阅读全文

【javascript基础】toString、valueOf、转换 【译】

2012-11-19 15:45 by sniper007, 419 阅读, 收藏, 编辑
摘要: js中的对象可以被转换成以下3个基本数据类型:1、Nunber2、String3、Boolean对上述转换的理解,我们可以绕过缺陷,并写出更整洁的代码。 一、字符转换 当需要一个对象的字符表示时候,将发生字符传唤。e.g.在alert中输出objvarobj={name:'John'}alert(obj)//[objectObject] 当然,也可以显示转换,String(obj);对象转换成字符串的逻辑 对象转换成字符串的逻辑如下: 1、如果对象有toString方法,则调用该方法,并返回相应的结果; PS:代码通常会执行到这,因为在所有对象中都有toString方法。 2、 阅读全文

【javascript基础】延长作用域链

2012-11-16 11:59 by sniper007, 548 阅读, 收藏, 编辑
摘要: 延长作用域链,意思是,在当前作用域链的前端临时添加一个变量对象。该变量对象会在代码执行完之后移除。这通常发生在两个语句中,try-catch的catch语句with语句 对于with语句而言,其变量对象中包含为指定对象的所有属性和方法所作的变量声明。对于catch而言,其变量对象包含被抛出错误对象的声明。举个例子:+function(){try{alert(x);}catch(e){console.log(e);}console.log(e);}()标准浏览器,而IE8,结果如下:在IE中,catch语句之外也可以访问到错误对象,很奇怪 阅读全文

【javascript基础】【setTimeout setInterval】 之 setTimeout基本概念及浏览器兼容性

2012-11-13 16:56 by sniper007, 678 阅读, 收藏, 编辑
摘要: 一、定义:在指定的延迟时间之后调用一个函数或者执行一个代码片段.二、语法:vartimeoutID=window.setTimeout(func,delay,[param1,param2,...]);vartimeoutID=window.setTimeout(code,delay);说明: timeoutID 是该延时操作的数字ID, 此ID随后可以用来作为window.clearTimeout方法的参数. func 是你想要在delay毫秒之后执行的函数. code 在第二种语法,是指你想要在delay毫秒之后执行的代码 (使用该语法是不推荐的, 不推荐的原因和ev... 阅读全文

【javascript基础】【setTimeout setInterval】 之 How JavaScript Timers Work [译]

2012-11-13 15:03 by sniper007, 317 阅读, 收藏, 编辑
摘要: At a fundamental level it's important to understand how JavaScript timers work. Often times they behave unintuitively because of the single thread which they are in. Let's start by examining the three functions to which we have access that can construct and manipulate timers. var id = setTim 阅读全文

【javascript基础】keypress keydown keyup的区别

2012-11-13 11:02 by sniper007, 475 阅读, 收藏, 编辑
摘要: 一、定义:KeyDown:在控件有焦点的情况下按下键时发生。 KeyPress:在控件有焦点的情况下按下键时发生。(下面会说和KeyDown 的区别) KeyUp:在控件有焦点的情况下释放键时发生。二、促发的顺序: KeyDown KeyPress KeyUp demo : <inputtype="text"id="wrap"/><scripttype="text/javascript">function$(str){returndocument.getElementById(str);}$("wra 阅读全文

【javascript基础】之【ecmascript5新特性】之Object.create

2012-11-12 23:21 by sniper007, 194 阅读, 收藏, 编辑
摘要: 方法定义:用原型对象及属性的方式来新建一个对象。语法 :Object.create(proto[,propertiesObject])参数说明:proto :该参数所传入的对象将会成为新对象的原型。propertiesObject : 类似这样的值,{age:{value:26},name:{value:"sunlaohu"}}注意点:如果proto参数传入的不是null或object,则会抛出TypeError 错误。demo:varo;//创建一个原型为null的对象o=Object.create(null);o={};//上行代码相当于:o=Object.create 阅读全文

【javascript基础】 Nine Javascript Gotchas 【翻译】JavaScript的9个陷阱及评点

2012-11-12 19:08 by sniper007, 302 阅读, 收藏, 编辑
摘要: 原文1) Comma Caused CoruptionvartheObj={city:"Boston",state:"MA",}Notice the comma after "MA"? It will be the source of many woes. Firefox will pay it no heed, but it will create a syntax error in IE. Worst of all, IE will not tell you where the actual bug is. The only so 阅读全文

【js基本功能模块】“回到顶部”代码优化

2012-11-12 18:01 by sniper007, 333 阅读, 收藏, 编辑
摘要: 以前项目里面“回到顶部”思路是:动态插入div,设置相对定位,ie6绝对定位,窗口"resize,scroll"的时候动态改变位置,即使是相对定位的时候,也要动态计算位置。新的思路: 动态插入一个div(如下图),居中,相对定位,然后计算下位置,里面的元素,支持fixed,用fixed,IE6,单独计算,这么做的好处是,在窗口resize,scroll的时候,支持fixed的浏览器不用再重新计算元素的位置了,IE6难免的,还是要计算 顺便我把项目的里面的代码片段贴一下varTOPPANEL="#MST-common-panel",SIDEPANEL=&q 阅读全文

【javascript基础】childNodes兼容性

2012-11-12 17:44 by sniper007, 273 阅读, 收藏, 编辑
摘要: childNodes:获取子节点标准浏览器(包括IE9,IE10)使用childNodes获取节点,它会将空格符、回车符、换行符也看做一个文本节点IE6,7,8 会将空格符、回车符、换行符过滤掉所以我们做的时候只要判断,nodeType属性是否等于1就行了 阅读全文

【javascript基础】JS正则表达式的实例方法

2012-11-01 12:03 by sniper007, 309 阅读, 收藏, 编辑
摘要: exec RegExp对象的主要方法是exec(),该方法专门为捕获组而设计的。定义和用法exec() 方法用于检索字符串中的正则表达式的匹配。语法RegExpObject.exec(string)参数描述string必需。要检索的字符串。返回值返回一个数组,其中存放匹配的结果。如果未找到匹配,则返回值为 null。说明exec() 方法的功能非常强大,它是一个通用的方法,而且使用起来也比 test() 方法以及支持正则表达式的 String 对象的方法更为复杂。如果 exec() 找到了匹配的文本,则返回一个结果数组。否则,返回 null。此数组的第 0 个元素是与正则表达式相匹配的文本,第 阅读全文

【javascript基础】JS正则表达式的实例属性

2012-11-01 11:46 by sniper007, 226 阅读, 收藏, 编辑
摘要: RegExp的每个属性都有下列属性:global——boolean,表示是否设置了g标志ignoreCase——boolean,表示是否设置了i标志lastIndex——number,表示开始搜索下一个匹配项的字符位置,从0算起multiline——boolean,表示是否设置了m标志source——正则的字符串表示,按照字面量形式而非传入构造函数中的字符串模式返回demo:varregExp1=/(\d)/ig;varregExp2=newRegExp("(\\d)","g");//结果:(\d)console.log(regExp1.source); 阅读全文

【javascript基础】JavaScript语法支持严格模式:”use strict”

2012-10-30 15:57 by sniper007, 3254 阅读, 收藏, 编辑
摘要: 浏览器支持情况:IE10+Firefox4+Chrome11+Opera11.6+Safari5.14+4.2.2 ECMAScript的严格变体的概念.(Strict Variant)ECMAScript语言认可一些用户所期望的,在语言特性实现上施加的某些限制.之所以他们会期望这样,可能是出于安全方面的考虑,又或者是为了避免一些容易出错的地方,获得更好的错误检查 .又或者是其他什么原因.为了支持这个可能性.ECMAScript,定义了一个语言的严格变体.这个变体排除或修改了,正规的ECMAScript语言的一些特性语法和语义的实现. ECMAScript的这种严格变体,一般被称为语言的... 阅读全文

【javascript基础】mouseover和mouseenter mouseout和mouseleave的区别

2012-10-25 15:09 by sniper007, 229 阅读, 收藏, 编辑
摘要: mouseenter() 方法 只有在鼠标指针经过被选元素时(不包括鼠标指针经过任何子元素),才会触发 mouseenter 事件。 mouseover ()方法在鼠标指针经过被选元素或者经过任何子元素时,都会触发 mouseover 事件。不论鼠标指针离开被选元素还是任何子元素,都会触发 mouseout 事件。 只有在鼠标指针离开被选元素时,才会触发 mouseleave 事件。 demo :<divid="wrap"style="padding:50px;background:red;"><divid="inner&qu 阅读全文

【javascript基础】Timed array processing in JavaScript【转】

2012-09-12 12:10 by sniper007, 241 阅读, 收藏, 编辑
摘要: Not too long ago, I blogged about a way to asynchronously process JavaScript arrays to avoid locking up the browser (and further, to avoid displaying the long-running script dialog). The chunk() function referenced in that original blog post is as follows:functionchunk(array,process,context){varitem 阅读全文

【javascript基础】闭包

2012-08-28 17:01 by sniper007, 222 阅读, 收藏, 编辑
摘要: 作用域链和标识符解析 每一个JS 函数都表示为一个对象,该对象有一个内部属性[[Scope]],它包含了一个函数被创建的作用域中对象的集合,这个集合被称为函数的作用域链(Scope chain),它决定哪些数据能被函数访问。函数作用域中的每个对象被称为一个可变对象(variable object)。当一个函数创建后,它的作用域链会被创建此函数的作用域中可访问的数据对象所填充。 例如下面这个全局函数: functionadd(num1,num2){varsum=num1+num2;returnsum;} 由于此函数是在全局作用域下创建的,所以函数add() 的作用域链中只填入了一个单独的可变.. 阅读全文

【javascript基础】javascript中的#和javascript:void(0)的区别

2012-08-27 18:34 by sniper007, 410 阅读, 收藏, 编辑
摘要: JavaScript中#的含义:"#"包含了一个位置信息 默认的锚点是#top 也就是网页的上端 <a href="#"> 点击链接后,页面会向上滚到页首,# 默认锚点为 #TOP(实际测试发现 滚动条会滚到顶端) 而javascript:void(0) 仅仅表示一个死链接,例如:<a href="javascript:void(0)" > 点击链接后,页面不动。 <a href="#" onclick="javascript:return false;"> 阅读全文

【javascript基础】深入理解javascript中的eval函数

2012-08-24 15:53 by sniper007, 459 阅读, 收藏, 编辑
摘要: 发现为本文起一个合适的标题还不是那么容易,呵呵,所以在此先说明下本文的两个目的:(1)介绍javascript中的eval函数的用法(2)如何在函数内执行全局代码 ►先来说eval的用法,内容比较简单,熟悉的可以跳过。 eval函数接收一个参数s,如果s不是字符串,则直接返回s。否则执行s语句。如果s语句执行结果是一个值,则返回此值,否则返回undefined。需要特别注意的是对象声明语法“{}”并不能返回一个值,需要用括号括起来才会返回值,简单示例如下: varcode1='"a"+2';//表达式varcode2='{a:2}';//语句 阅读全文

【javascript】Convert any colour value to hex in MSIE

2012-07-12 14:07 by sniper007, 214 阅读, 收藏, 编辑
摘要: The following function will convert any colour value (rgb, named colours, etc) to the hex equivalent in MSIE:functiontoHex(color){varbody=createPopup().document.body,range=body.createTextRange();body.style.color=color;varvalue=range.queryCommandValue("ForeColor");value=((value&0x0000ff 阅读全文