模拟实现 Range 的 insertNode() 方法

最近对 Range 和 Selection 比较感兴趣。 基本非 IE 的浏览器都支持 DOM Level2 中的 Range,而 IE 中仅有自己的简单处理方法(Text Rang)。 扩展阅读: 《TextRange Prototype》 《Document Object Model Range》 《Javascript标准DOM Range操作(1)》(节选自《JavaScript 高级程序设计》) 《Javascript标准DOM Range操作(2)》(节选自《JavaScript 高级程序设计》) 《Javascript标准DOM Range操作(3)》(节选自《JavaScript 高级程序设计》) 而 IE 下的 Text Rang 主要用来处理文本,并非 DOM 节点,那如何在 IE 下模拟 DOM Level2 中的 Range 呢? 根据规范的 API,我们需要模拟下述属性和方法: function zRange() { // Inital states this.startContainer […]

... 7 条评论 »

DOM 元素如何获得焦点

首先让我们看看哪些元素可以直接获得焦点(element..focus()): // Form : http://www.w3.org/TR/html5/editing.html#focusable a elements that have an href attribute link elements that have an href attribute button elements that are not disabled input elements whose type attribute are not in the Hidden state and that are not disabled select elements that are not disabled textarea elements that are not disabled command elements […]

... 4 条评论 »

获取 Textarea 的光标位置

在任何编辑器中,获取光标位置都是非常重要的,很多人可能认为较难,其实只要处理好浏览器的兼容,还是比较容易实现的。 下面我们一起来看看如何获取到 Textarea 元素中的光标位置(测试地址)。 首先,我们用 rangeData 对象作为数据存储,并获得焦点: var rangeData = {start: 0, end: 0, text: “” }; textarea.focus(); 对于非 IE 浏览器获取选区的起始和末尾位置其实非常容易: rangeData.start= el.selectionStart; rangeData.end = el.selectionEnd; 通过截取我们可以得到光标的选区内容: rangeData.text = (rangeData.start != rangeData.end) ? el.value.substring(rangeData.start, rangeData.end): “”; 而对于 IE 浏览器处理起来就比较麻烦了,但我们依旧可以获取到选区: oS = document.selection.createRange(); 同时还可获取 Textarea 元素的选区: // 为了使 oR 与 oS 在同一等级上比较,请勿使用:oR = ... 16 条评论 »

用 Python 架设一个简单的服务器

import string,cgi,time from os import curdir, sep from BaseHTTPServer import BaseHTTPRequestHandler, HTTPServer class MyRequestHandler(BaseHTTPRequestHandler): def do_GET(self): try: if self.path.endswith(‘.html’): f = open(curdir + sep + self.path) self.send_response(200) self.send_header(‘Content-type’,’text/html’) self.end_headers() self.wfile.write(f.read()) f.close() return elif self.path.endswith(‘.py’): self.send_response(200) self.send_header(‘Content-type’,’text/html’) self.end_headers() self.wfile.write(“hey, today is the” + str(time.localtime()[7])) self.wfile.write(” day in the year ” + str(time.localtime()[0])) return else: self.send_error(404, ‘File […]

... 6 条评论 »

类型转换的小乐趣

在 玉伯 的文章 《一道大题目,嘿嘿》 中有这样一段代码: [] == ![] 也许很多同学迷惑:咦,这个如何转换呢? 首先,我们了解下逻辑 NOT(!)运算与等号(==)运算的一些基本规则: 逻辑 NOT 运算中,如果运算数是对象,返回 fasle; 等号运算中,如果一个运算数是 Boolean 值,在运算前,会将其转换成数字:false -> 0,true -> 1; 等号运算中,如果一个运算数是对象,另一个是数字,在运算前,会将对象转换成数字。 2010年11月2日补充:对象不能直接转换成数字型,可以将其转换成字符型,再将字符型转换成数字型。 根据上面的一些规则,我们再来看看原来的表达式如何演变: Step01: [] == ![] // 由于[]是对象,则 ![] 返回fasle,演变为 Step02。 Step02: [] == fasle // 由于 fasle 是 Boolean 值,则转换成数字 0,演变为 Step03。 Step03: [] == 0 // 由于 0是数字,[]是对... 9 条评论 »