摘要：
很多css属性都依赖于长度单位来显示各种页面元素，所以就会有许多种方法来度量长度。所有的长度都可以表示为整数或负数。所有长度单位后面都会跟有两字母组成的缩写，表示长度单位。长度单位可以划分为两类：绝对长度单位和相对长度单位。绝对长度单位一共有5中绝对长度单位： in英寸 cm厘米 mm毫米 pt点：一般，一英寸是72点 pc派卡：1派卡相当于12点但是，只有在浏览器知道显示页面的显示器，所用的打印机等设备的具体细节时，这些单位才会真正的起效用。往往显示器的大小和分辨率都会影响显示效果，所以我们往往无法解决这方面的问题，只能寄希望于这些度量相互之间是一致的，即1.0in是0.5in的两倍大。绝对 阅读全文
摘要：
Javascript与浏览器交互的途径主要是事件的形式。事件是一种观察者的设计模式，对象可以发布时间，然后其它对象可以观察该对象，等待这些时刻到来并通过运行代码来响应。观察者模式主要由主体和观察者组成。主体负责发布事件，同时观察者通过订阅这些事件来观察该主体。该模式的一个关键概念是主体并不知道观察者的任何事情，也就是说它可以独自存在并正常运行即使观察者不存在。从另一方面来讲观察者知道主体并能注册事件的回调函数（事件处理程序）。事件是与DOM交互的最常用的方式，但也可以用于非DOM的代码中—通过实现自定义事件。自定义事件的机制其实就是创建一个可以管理事件的对象。让其他对象监听那些事件。 1 fu 阅读全文
摘要：
通过对对象的创建，继承的理解，我们可以发现，在平时使用时，prototype和实例中的属性都可以直接通过this.para来调用。而且优先使用实例中的属性，然后在根据原型链一步步的向上寻找属性的位置，直到找到为止。在平时，这些机制对于我们使用对象有很大帮助，但是有时候会产生实例属性覆盖原型属性，使我们调用不到正确的值。这时候我们就首先要判断我们现在能得到的属性来自于哪个位置。首先是in操作符，in操作符可以判断某个属性在对象中能否被访问，不管是在实例中还是原型中。看以下这个例子： 1 function Myobj(){ 2 this.name='Tom'; 3 this.age 阅读全文
摘要：
对于mousedown和mouseup来说，其event对象中存有一个button属性，表示按下或释放的按钮。DOM中属性有3个值：0表示主鼠标按钮，1表示中间的鼠标按钮，2表示次鼠标按钮（右键）。但是对于IE8及之前的版本来说，button中所存的值又是不同的： 0：表示没有按下鼠标按钮 1：表示按下主鼠标按钮 2：表示按下次鼠标按钮 3：表示同时按下主次鼠标按钮 4：表示按下了中间的鼠标按钮 5：表示同时按下了主鼠标按钮和中间鼠标按钮 6：表示同时按下了中间和次鼠标按钮 7：表示同时按下主，中间，次鼠标按钮可以发现，这些button属性和DOM中规定的相比复... 阅读全文
摘要：
右键菜单的设定主要是通过contextmenu事件来激活，由于contextmenu事件是冒泡的，所以可以为document来指定事件，进行页面中该事件的统一处理。同时，因为contextmenu是一个鼠标事件，所以在event中包含有鼠标位置等一系列信息，可以通过这个来实现对浏览器右键菜单的模拟。为了兼容现在的主流浏览器，所以先做一个通用的事件加载函数：1 function eventHandler(dom,type,fn){2 if(typeof dom.addEventListener != 'undefined'){3 dom.addEventListener(... 阅读全文
摘要：
1.跨文本消息传递跨文本消息传递是指来自不同的域之间的页面相互传递消息，他的核心是postMessage()方法，即向另一个地方传递数据。对于psotMessage而言，另一个地方可以是页面中的iframe或者由当前页面弹出的窗口。它接受两个参数，一个消息和一个表示消息接收方来自哪个域，如下代码：1 var iframeWin = document.getElementById('myFrame').contentWindow;2 iframeWin.postMessage('some message','http://www.cy.com'); 阅读全文
摘要：
富文本编辑器，可以让我们更方便的设计规划我们自己想要的应用程序。富文本编辑器的原理是在HTML中嵌入一个空的HTML页面，然后通过设置designMode属性，使得这个空白HTML可被编辑，而编辑后的源码就是原理body中的HTML代码。designMode有两个属性，是on和off，当设置为on的时候，整个文档就处于可编辑的状态，然后就可以像word一样进行文字处理。先看一下实施后的简易富文本编辑器，因为只是做个示例，所以并没有把所有功能都加入进去，只是做了很少的一部分，以下是代码 1 2 3 33 34 35 富文本编辑器36 37 38 ... 阅读全文
摘要：
DOM遍历现有用于辅助完成顺序遍历DOM结构的类型有两个，NodeIterator和Treewalker。在于DOM兼容的浏览器中，都可以访问这两个对象，IE不支持DOM遍历，使用下列代码可以检测浏览器对DOM2级遍历的支持情况：1 var supportTraversals = document.implementation.hasFeature('Traversal','2.0');2 var supportNodeIterator = (typeof document.createNodeIterator == 'function');3 阅读全文
摘要：
在HTML中使用样式有三种方式，link引入、style中编写和元素中定义具体style。DOM2对这三种提供了一系列API，要确定是否可以使用这些方法，可以用以下代码判断：var isSupportDom2CSS = document.implementation.hasFeature("CSS","2.0");var isSupportDom2Css2 = document.implementation.hasFeature("CSS2","2.0");访问元素的样式 支持style的元素都会含有一个style 阅读全文
摘要：
闭包的基本概念在js中，闭包指的是有权访问另一个函数作用域中的变量的函数，最常见的就是在函数中创建函数，即如下：function outfunction(outnum){ return function(){ var innum = 1; console.log(outnum); console.log(innum); }}在代码中，用红色标出的就是内部函数引用外部函数值的地方，实现原理是在闭包函数执行时，遇到变量首先会检索当前执行环境下的变量，即活动对象，然后在未找到的情况下，向外部函数查找，这样直至找到全局对象为止。这也是闭包的作用域链... 阅读全文