feng_sundy 的专栏

键盘事件包括keydown、kepress和keyup三种，每次敲击键盘都会(依次？)触发这三种事件，其中keydown和keyup是比较低级的接近于硬件的事件，通俗的理解是这两个事件可以捕获到你敲击了键盘中某个键；而keypress是相对于字符层面的较为高级点的事件，这个事件能够捕捉到你键入了哪个字符。可以这样理解，如果你敲击了A键，keydown和keyup事件只是知道你敲击了A键，它并不知道

 一、DOM的原型　　发现一个问题，在FireFox下，如下代码在prototype加载的前提下能运行：　　document.getElementById("div1").addClassName("loading").show();　　我就奇怪了，这个中间不用Element.extend一下也会有那些扩展的方法，这是怎么回事。关于这个问题，中文资料很少，我查了很久，找到两篇文章，提到

前面把prototype的相关API都研究了，代码也粗略地通读了一下，许多地方未及深究。这儿来使用使用。　　一、写个遮住整个页面的遮罩　　var ele=new Element("div",{id:"msg2"});　　ele.setStyle({　　　　position:"absolute",　　　　backgroundColor:"#000",　　　　width:document.vi

　　可能大伙都不晓得ExtJs中有一个这样的好函数：alignTo，它的作用是把一个元素的某一点对齐到另一元素的某一个点上，这个问题比较麻烦。也许这样说，大伙还是不明白，特贴图如下：　　上图是在一个按钮的右边弹出菜单，怎样解决这种需求，在一个元素的任意一个相对的位置弹出菜单。这都是alignTo要解决的问题。这个问题在ExtJs中已解决，但是prototype没有封装这样的功能，为此，我把

 Position是prototype中定义的一个对象，提供了操作DOM中与位置相关的方法，要很好的理解元素在页面中的位置，具体代码如下，按照代码说说，其中英文是作者的注释，中文的才是偶的说明或翻译英文的注释，采用顶式注释法(注释在要说明的代码的上面)说明 // set to true if needed, warning: firefox performance problems 

 这一部分提供了很多与表单操作有关的功能，包括以下部分，当通过$方法返回元素时，可以直接通过$(element).method()调用： 　　Form对象：提供了操作整个表单的一些方法 　　Form.Element对象：提供了操作某个表单元素的方法 　　TimedObserver类：周期性表单监视器，当表单元素值改变的时候执行一个回调函数，有Form和Element两种类型 　　E

 javascript中存在几种对URL字符串进行编码的方法：escape()，encodeURI()，以及encodeURIComponent()。这几种编码所起的作用各不相同。 escape() 方法： 采用ISO Latin字符集对指定的字符串进行编码。所有的空格符、标点符号、特殊字符以及其他非ASCII字符都将被转化成%xx格式的字符编码（xx等于该字符在字符集表里面的编码的16进

Prototype中的ajax.js提供了一个非常好用的ajax框架，一般应用中简单的调用以下代码就可以了 new Ajax.Request(　　url, {method: “get”,　　onSuccess: showFilter,　　onFailure: function(request){alert(”Server error!”)},　　onException: showError});

 Location 对象是 Window 对象的一个部分，可通过 window.location 属性来访问。 举例说下 Location 对象 的属性与方法 hash:设置或返回从井号 (#) 开始的 URL（锚） 网址:http://www.youkuaiyun.com/index.html#head 返回:#head document.write(location.pathname); ho

 在javascript中，String的函数replace()简直太让人喜爱了。它灵活而强大的字符替换处理能力，让我不禁想向大家介绍它。 replace()最简单的算是能力就是简单的字符替换。示例代码如下：   var strM = "javascript is a good script language"; //在此我想将字母a替换成字母A alert(strM.replace(

何谓义贯？是指以义理贯穿。script.aculo.us啦，名气很大，但是，从没人开个头来分析它的原理，它是怎样实现的，前一文中分析了前面二百来行的代码，这个部分是基础，把它仔细研究了一下，机理也清楚了。上一文讲的是代码，不大看得懂。这一篇再在文字上总结一下。表达能力有限，我分几点说，读者综合几点一想就清楚了。一、一个effect是怎样运行起来的？呐闷吧？！所有的effect，大多都是new一下就

　　这一篇中总结一下关于prototype的最实用的东西。　　一、资源的下载　　　　prototype的下载、script.aculo.us的下载　　二、prototype的压缩　　　　在prototype官方网站并没有压缩版的下载。1.6.0.2版是目前最新的版本，大小有123k，用aptana压缩一下有97k，用jsMinifier压缩一下，还有71.8。到网上一查就可以查到j

使用$A()函数 $A()函数能把它接收到的单个的参数转换成一个Array对象。 这个方法，结合被本类库扩展了的Array类，能方便的把任何的可枚举列表转换成或拷贝到一个Array对象。一个推荐的用法就是把DOM Node Lists转换成一个普通的Array对象，从而更有效率的进行遍历，请看下面的例子。    function showOptions(){   var som

Div与CSS布局，最让人头疼的就是容器内的东西如何垂直居中的问题，我在做站时也遇到，查了一下资料，总结出以下居中办法，兼容IE与及Firefox方法一HTML代码 <!-- * {margin:0;padding:0}div { width:500px; height:500px; border:1px solid #666; overflow:hidden;

 上一篇把Element的所函数都梳理了一遍，下面总结一下这些函数的功能，毕竟函数太多，不分门别类一下还是没有底。　　一、筛选类函数　　ancestors、recursivelyCollect、descendants、firstDescendant、immediateDescendants、previousSiblings、nextSiblings、siblings、match、up、do

 转自：http://tianmoboping.blog.163.com/blog/这一篇主要是要总论Element的所有函数。　　所有函数的第一个参数都为：element，表示要操作的元素的引用，这是为了方面在Element.extend时，把这些方法加入到DOM对象中去，用的是methodize函数。调用的时候不需要输入第一个参数了，如：　　var b=$(div1).visibl

 总结： 一、函数定义： 1.在实例和类上都可以直接定义函数 2.不能在实例上使用prototype定义函数，只能在类上使用prototype定义函数 3.类上直接定义的函数不能使用this访问对象的属性 4.在类的prototype上建立的函数可以用this,在类内部定义的函数可以使用this,在对象实例上建立的函数额可以this  window.alert=function (

 Prototype 中的Selector主要支持tag选择器、class选择器和id选择器，还有属性(attribute)选择器，Selector是利用css selector来匹配选择页面元素的，所以要理解Selector首先应该对css selector有所理解，下面是css2 selector的语法，当然很多浏览器只是支持其中的一部分，基本上包含我们平时所用的所有类型The followi

 以下为对原文的翻译： 判断对象存在的方法 很快你就会注意到，JavaScript的部分功能在部分浏览器中无效。如果你要使用一些脚本的高级特性，你首先要检查浏览器是否支持要使用的对象，本文具体说明判断的正确方法。  通过判断浏览器的版本：不！  如果你想知道浏览器是否支持代码中使用的那些对象，记住，永远都不要通过浏览器的版本来判断。我确定你知道，有些浏览器支持你的代码，而有

 我们先看一个关于Javascript利用循环绑定事件的例子： 例如：一个不确定长度的列表，在鼠标经过某一条的时候改变背景。 http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> http://www.w3.org/1999/xhtml" > Untitled Page 第1条记录 第2条记录 第3条记录 第4条记录 第

 今天看一个JS的脚本，发现里面有一句话是这样子写的 var obj = document.getElementById("btn1") || document.getElementById("btn2"); 我觉得这个很奇怪，去查了一下||符号的意思，官方的说法是，逻辑或运算，我理解的应该是返回TRUE或FALSE吧，可以神奇的是JAVSCRIPT居然把可以找到的对象返了回来，我做了个试验，在页

 JavaScript 是面向对象的。但是不少人对这一点理解得并不全面。 在 JavaScript 中，对象分为两种。一种可以称为“普通对象”，就是我们所普遍理解的那些：数字、日期、用户自定义的对象（如：{}）等等。 还有一种，称为“方法对象”，就是我们通常定义的 function。你可能觉得奇怪：方法就是方法，怎么成了对象了？但是在 JavaScript 中，方法的确是被当成对象来处理的

1.window.event兼容脚本 2.屏蔽Form提交事件 3.获取事件源 4.添加事件兼容写法 5.Firefox注册innerText写法 6.长度 7.父控件下的子控件 8.XmlHttp  1.window.event兼容脚本 function getEvent(){ //获取浏览器事件，同时兼容ie和ff的写法 if(document.all) return window

 关于闭包 prototype.js在Class.create,bind等中用到javascript的闭包特色。但整体上prototype.js对于强大的闭包特性用的不多。大家可以参阅我翻译的篇文章了解闭包。3、让我比较反感的两个方法（1） var Class = {  create: function() {    return function() {       th

 DOM定义对操作一个文档对象的节点结构提供了实用的方法,它提供了像执行对象插入,更新,删除,克隆等这些常用的方法。这部分提供了很多(写的都有点烦了)方便的操作dom的方法：包含有名的$方法、document.getElementsByClassName方法，以及Element对象、Insertion对象 　　以下部分一个一个的详细介绍： 　　$(element)：getElementBy

prototype只有底层没有UI，不像dojo、ExtJs一样自身就以创建UI为目标，再加上prototype对Element的加强还没有到至善至美的地步，所以呢，用prototype创建widgets有时还是会有一些麻烦，例如我上次从ExtJs去请了个alignTo，那个getScroll这么重要，但是在prototype就是没有。说这么多废话就是要表明：UI很重要，但是prototype本身

String.prototype.parseColor()string=rgb(12,34,56)、#444(只有三位数)，把string转化成#xxxxxx。之所以这么表达，是要表达清这个函数是实例函数还是静态函数。很多资料上讲来讲去，我们还是不清楚这个是个什么类型的函数。这样一写不就清楚了吗。Element.collectTextNodes = function(element)把elemen

请见下图：这种效果应用极为广泛，一直以来，没有对这个问题进行扎扎实实的研究。今天抽出时间来琢磨一下。这个问题的参考资料点此处进入。此效果一般有两种用途：导航栏、Tabs页的标签。这个效果看起来很简单，事实上实现起来还是有点麻烦的。还好有别人的例子。不过，这种效果实现起来有很多种方法。这儿介绍的是一种纯css实现的方法，不需要javascript参与。其html结构如下：div clas

转自：http://tianmoboping.blog.163.com/blog/Element，哈哈哈。遇到正主了，到现在为止才遇到让我高兴的玩意。当初Ext.Element可是花三千余行代码专门来封装啊。我倒要看一看它的代码了。事实上prototype中我最想研究的只有两个内容：Element、Selector。这两个东西是精华。先说一下Element对DOM扩展的技术思路，我也是看了一天的代

<br />今天发现一个奇怪的问题。<br />IE8版本对javascript的parseInt函数的一个奇怪问题。<br /><script><br />alert(parseInt('06') + ',' + parseInt('07') + ',' + parseInt('08') + ',' + parseInt('09'));<br /></script><br /> <br />大家都以为输出是6,7,8,9<br /> <br />可是实际上输出是6,7,0,0<br /> <br />对于