努力思考 + 实践, 眼高手低是不行的. 注册 | 登陆
浏览模式: 标准 | 列表Tag:javascript

顽皮的闭包

部分引用来源:http://www.cnblogs.com/rubylouvre/archive/2009/07/24/1530074.html

问题描述
有个函数fn, 定义在某作用域r中, 函数fn的定义语句中包含对作用域v的某个变量v的引用, 由于变量v的作用域在v中, 所以倘若函数a将变量v绑定到位于其他作用域的应用中时, 变量v无法以window.v 或者 obj.v 的形式在后期引用, 只好以指针或者变量地址方式保存在函数a中用以持久变量v.

[详见全文]

» 阅读全文

Tags: javascript, 闭包

Javascript 获取页面高度(多种浏览器)

在我本地测试当中:
在IE、FireFox、Opera下都可以使用
document.body.clientWidth
document.body.clientHeight
即可获得,很简单,很方便。
而在公司项目当中:
Opera仍然使用
document.body.clientWidth
document.body.clientHeight
可是IE和FireFox则使用
document.documentElement.clientWidth
document.documentElement.clientHeight
原来是W3C的标准在作怪啊
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd

定义标准
IE:
document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.clientHeight ==> 可见区域高度

FireFox:
document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.clientHeight ==> 可见区域高度

Opera:
document.body.clientWidth ==> 可见区域宽度
document.body.clientHeight ==> 可见区域高度
document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)
document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)

未定义标准
IE:
document.documentElement.clientWidth ==> 0
document.documentElement.clientHeight ==> 0

FireFox:
document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)
document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)

Opera:
document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)
document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)

真是一件麻烦事情,其实就开发来看,宁可少一些对象和方法,不使用最新的标准要方便许多啊。

Tags: javascript, 标准

IE与FF下对节点操作的问题若干

好久没碰JavaScript,都快忘光了,惭愧惭愧。

今天鸭子说他想让他博客文章的首段首字下沉显示,虽然说可以用CSS中的伪对象first-letter进行样式控制,但是没办法精确到首段(文章内容是FCK生成的N个段落,加ID这个方法也行不通了),也就是定义后文章的每段首字都会下沉,这样就达不到类似报刊的排版效果了,我思量了一下,也只能用JS来解决了。

XML/HTML代码
  1. <div id="Article_Content">  
  2.   <p>段落1</p>  
  3.   <p>段落2</p>  
  4.   <p>段落3</p>  
  5. </div>  
JavaScript代码
  1. <script type="text/javascript">   
  2. <!--   
  3. window.onload = function() {   
  4.     var content = document.getElementById("Article_Content");   
  5.     var p = content.getElementsByTagName('p')[0];   
  6.     p.setAttribute("class""yourStyle");     //FireFox   
  7.     p.setAttribute("className""yourStyle"); //IE   
  8. };   
  9. //-->   
  10. </script>  

注意,在IE下给元素节点添加class属性必须用className……

除此之外,还发现一个问题:如果你想获得某个容器下的第一个节点,IE和FF还是有区别滴~如使用

JavaScript代码
  1. var obj = document.getElementById['Article_Content'].childNodes[0];  

可以获得Article_Content容器下的第一个节点,但是,使用

JavaScript代码
  1. alert(obj.nodeType);  

测试,发现IE下获得的是元素节点(1),而在FF下获得是文本节点(3),在这种情况下,你可以用循环遍历获得你想要的节点

JavaScript代码
  1. var rightNode = someNode.childNodes[0];   
  2. while(rightNode.nodeName != 'p'){   
  3.   if(rightNode.nextSibling){   
  4.     rightNode = rightNode.nextSibling;   
  5.   }else{   
  6.     break;   
  7.   }   
  8. }  

或者使用上文的

JavaScript代码
  1. var p = content.getElementsByTagName('p')[0];  

精确获得。

参考文章:开发跨浏览器javascript---《Ajax基础教程》笔记

Tags: javascript, ie, firefox, css

input高级限制级用法

1.取消按钮按下时的虚线框
2.只读文本框内容
3.防止退后清空的TEXT文档(可把style内容做做为类引用)
4.ENTER键可以让光标移到下一个输入框
5.只能为中文(有闪动)
6.只能为数字(有闪动)
7.只能为数字(无闪动)
8.只能输入英文和数字(有闪动)
9.屏蔽输入法
10. 只能输入 数字,小数点,减号(-) 字符(无闪动)
11. 只能输入两位小数,三位小数(有闪动)

详见全文

» 阅读全文

Tags: 网页技巧, html, javascript

[转] 不可多得的Javascript(AJAX)开发工具 - Aptana

自从开始做Web开发起,一直都没有找到一个很让人满意的Javascript开发工具。从Editplus、Dreamweaver到FrontPage、Visual Studio,没有一样是很称手的。你是不是还在为Visual Studio中的那一点点智能提示感到兴奋不已?的确VS比其他的好那么一点点,但是相对于VS中的C#、VB等来说对javascript的支持实在是太少了。

下面我要向你介绍一款非常优秀的Javascript(AJAX) 开发工具:Aptana。应为它实在太棒了,所以我忍不住想向你推荐它。

【详见全文】

» 阅读全文

Tags: ide, javascript, ajax, 开发工具, aptana

[PEA福州] Zifa FormValid 0.5 更新[无js实现表单验证]

完全通过html不需要写JS验证程序就可以实现表单验证功能,可支持一个表单元件多条件验证, 同一页面多表单可同时使用,和服务端程序无关系,完全客户端方式。

更新情况:

http://www.coderhome.net/zifa/?p=71

详细:
http://bbs.coderhome.net/thread-4847-1-1.html

DEMO:
http://coderhome.net/demo/FormValid/

Tags: 框架, javascript

Prototype 入门

相关站点:http://www.prototypejs.org/

Prototype 是由 Sam Stephenson 开发的一个 Javascript 类库,也是其他框架的鼻祖。其对现有的部分 Javascript 对象比如 Object 、 Function 、 Dom 、 String 等进行扩展,并且对 Ajax 应用进行封装,借此提供了兼容标准的更加易于使用的类库,极大的方便开发人员快速创建具备高度交互性的 Web2.0 胖客户端应用程序。

Prototype 最初的目标是应用于 Ruby 领域的,不过由于优秀的表现和完美的封装以及服务器语言无关性,现在已经被应用到各个领域,包括 Java 、 .NET 、 PHP 等。不过在 Prototype 的源码中,还是可以找到 Ruby 的影子,比如 Ruby 样式的 Array 对象枚举。

正如之前提到的, Prototype 是一个底层的远程调用包,虽然其仅仅是一个千余行的 Javascript 文件,但是它为其他框架提供了最底层的 Javascript 扩展和 Ajax 封装。其他 Javascript 程序库在其基础上构建了更加高级的功能和 UI 效果,比如 Script.aculo.us 。

Prototype 目前的最新版本是1.5 ,其官方网站提供了最新版本的下载,包括 zip 包、 js 文件和 Subvision 源码。不过和其他版本一样, Prototype 官方网站并未提供完整的参考文档,开发者只能通过阅读源码掌握其功能。可喜的是,网上已经流传着不少关于 Prototype 源码解读和使用的文档,这在一定程度上弥补了 Prototype 官方文档不足的遗憾。

【详见全文】

» 阅读全文

Tags: 框架, javascript, 入门