2006年8月23日随笔档案 - 穷鬼

2006年8月23日

已决定离开,不再改变决定

posted @ 2007-01-14 16:09 穷鬼阅读(235) | 评论 (0) | 编辑收藏

明天会怎样

摘要: 阅读全文

posted @ 2006-11-05 19:12 穷鬼阅读(266) | 评论 (1) | 编辑收藏

setTimeout 和 setInterval 的区别

　window对象有两个主要的定时方法，分别是setTimeout 和 setInteval 他们的语法基本上相同，但是完成的功能取有区别。

　　setTimeout方法是定时程序，也就是在什么时间以后干什么。干完了就拉倒。

　　setInterval方法则是表示间隔一定时间反复执行某操作。

　　如果用setTimeout实现setInerval的功能，就需要在执行的程序中再定时调用自己才行。如果要清除计数器需要根据使用的方法不同，调用不同的清除方法：

例如：tttt=setTimeout('northsnow()',1000);

clearTimeout(tttt);

或者：

tttt=setInterval('northsnow()',1000);

clearInteval(tttt);

举一个例子：

<div id="liujincai"></div>
<input type="button" name="start" value="start" onclick='startShow();'>
<input type="button" name="stop" value="stop" onclick="stop();">
<script language="javascript">
   var intvalue=1;
   var timer2=null;
   function startShow()
   {
      liujincai.innerHTML=liujincai.innerHTML + " " + (intvalue ++).toString();
      timer2=window.setTimeout("startShow()",2000);
   }
   function stop()
   {
      window.clearTimeout(timer2);
   }
</script>

或者：

<div id="liujincai"></div>
<input type="button" name="start" value="start" onclick='timer2=window.setInterval("startShow()",2000);//startShow();'>
<input type="button" name="stop" value="stop" onclick="stop();">
<script language="javascript">
   var intvalue=1;
   var timer2=null;
   function startShow()
   {
      liujincai.innerHTML=liujincai.innerHTML + " " + (intvalue ++).toString();
   }
   function stop()
   {
      window.clearInterval(timer2);
   }
</script>

posted @ 2006-10-31 00:02 穷鬼阅读(278) | 评论 (0) | 编辑收藏

想找工作了

必须找工作了,最近计划如下:
1. 看完 ajax设计模式 2006.10.5
2.看完控件开发. 2006.10.6
3.实践.net 处理xml 2006.10.6
4.看完xslt cookbook 2006.10.7
5.看完webservice 的soap 结构 2006.10.8

加油啊! 还有好多要看的!!!

posted @ 2006-10-04 22:31 穷鬼阅读(209) | 评论 (0) | 编辑收藏

JavaScript中容易被误解的两个地方

摘要: 阅读全文

posted @ 2006-08-30 09:36 穷鬼阅读(307) | 评论 (0) | 编辑收藏

缓存友好的网页

摘要: 缓存友好的网页阅读全文

posted @ 2006-08-27 19:27 穷鬼阅读(372) | 评论 (0) | 编辑收藏

A Survey of the JavaScript Programming Language

摘要: A Survey of the JavaScript Programming Language 阅读全文

posted @ 2006-08-27 18:24 穷鬼阅读(343) | 评论 (0) | 编辑收藏

AJAX入门之深入理解JavaScript中的函数

摘要: AJAX入门之深入理解JavaScript中的函数阅读全文

posted @ 2006-08-27 16:39 穷鬼阅读(382) | 评论 (0) | 编辑收藏

实用javaScript技术总结(1):屏蔽类

一、屏蔽键盘所有键

二、屏蔽鼠标右键

　　在body标签里加上oncontextmenu=self.event.returnvalue=false　或者:

或者:

三、屏蔽 Ctrl+N、Shift+F10、F5刷新、退格键

注：这还不是真正地屏蔽 Alt+ 方向键，因为 Alt+ 方向键弹出警告框时，按住 Alt 键不放，用鼠标点掉警告框，这种屏蔽方法就失效了。

if ((event.keyCode == 8) &&
(event.srcElement.type != "text" &&
event.srcElement.type != "textarea" &&
event.srcElement.type != "password") || //屏蔽退格删除键
(event.keyCode==116)|| //屏蔽 F5 刷新键
(event.ctrlKey && event.keyCode==82)){ //Ctrl + R
event.keyCode=0;
event.returnvalue=false;
}
if ((event.ctrlKey)&&(event.keyCode==78)) //屏蔽 Ctrl+n
event.returnvalue=false;
if ((event.shiftKey)&&(event.keyCode==121)) //屏蔽 shift+F10
event.returnvalue=false;
if (window.event.srcElement.tagName == "A" && window.event.shiftKey)

window.event.returnvalue = false; //屏蔽 shift 加鼠标左键新开一网页
if ((window.event.altKey)&&(window.event.keyCode==115)){ //屏蔽Alt+F4
window.showModelessDialog("about:blank","","dialogWidth:1px;dialogheight:1px");
return false;}
}

　　另外可以用 window.open 的方法屏蔽 IE 的所有菜单
　　第一种方法：

window.open("你的.htm", "","toolbar=no,location=no,directories=no,menubar=no,

scrollbars=no,resizable=yes,status=no,top=0,left=0")

　　第二种方法是打开一个全屏的页面：

window.open("你的.asp", "", "fullscreen=yes")
*/
//-->
</script>

四、屏蔽浏览器右上角“最小化”“最大化”“关闭”键

　　或者使用全屏打开页面

　　注：在body标签里加上

onbeforeunload="javascript:return false"//使不能关闭窗口

五、屏蔽F5键

六、屏蔽IE后退按钮
　　在你链接的时候用

七、屏蔽主窗口滚动条
　　在body标签里加上

style="overflow-y:hidden"

八、屏蔽拷屏,不断地清空剪贴板
　　在body标签里加上

onload="setInterval('clipboardData.setData(\'Text\',\'\')',100)"

九、屏蔽网站的打印功能

十、屏蔽IE6.0 图片上自动出现的保存图标
　　方法一：

　　方法二：

十一、屏蔽页中所有的script

posted @ 2006-08-24 01:14 穷鬼阅读(213) | 评论 (0) | 编辑收藏

强制点击广告大法

强制点击广告大法(1)：如果你的广告点击率太低，这个方法可以强制访客先点击广告

把下面代码copy入你html文件的<head>和</head>中即可：

把下面代码copy入你html文件的<body>和</body>中即可：

<a href="http://www.webjx.com" onClick="gotoit(1)" target="_blank"><u>先帮忙点击这里</u></a><BR>
<a href="javascript:gotoit(num)"><u>进入</u></a><BR>

第一步:把如下代码加入<head>区域中

<SCRIPT language="JavaScript">
<!--
function MM_showHideLayers() { //v2.0
var i, visStr, args, theObj;
args = MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) { //with arg triples (objNS,objIE,visStr)
visStr = args[i+2];
if (navigator.appName == 'Netscape' && document.layers != null) {
theObj = eval(args[i]);
if (theObj) theObj.visibility = visStr;
} else if (document.all != null) { //IE
if (visStr == 'show') visStr = 'visible'; //convert vals
if (visStr == 'hide') visStr = 'hidden';
theObj = eval(args[i+1]);
if (theObj) theObj.style.visibility = visStr;
} }
}

</SCRIPT>

第二步:在<body>区中加入如下代码

<div id="Layer1" style="position:absolute; left:240px; top:175px; width:306px; height:63px; z-index:1; visibility: hidden"><a href="http://www.webjx.com"><font color=green size="5" face="隶书">带你去一个意想不到的地方!</font></a></font></div>
<div id="Layer2" style="position:absolute; left:280px; top:237px; width:147px; height:82px; z-index:2; visibility: visible">
<p align="center"><a href="http://www.webjx.com" target="_blank">
<img SRC="http://www.webjx.com/skill/mm.jpg" border="0" onMouseDown="MM_showHideLayers('document.layers[\'Layer1\']','document.all[\'Layer1\']','show')"></a></font><br>
</p>
</div>

第三步:把<body>区中内容改为:
<body bgcolor="#fef4d9" onLoad="MM_preloadImages()">

=======================================
强制点击广告大法(3)：两个文字链接要先后点击，否则就跳出警告框

第一步:把如下代码加入<head>区域中
<script language="JavaScript">
var num = 2;
var mypage = 'http://www.webjx.com';
var pissoff = ' 请先点击上面链接 ';
allow = Array();
allow[num] = 2;
function gotoit(link){
if (link != num){
allow[link] = 2;
} else {
for (i=1;i<=num;i++){
if (allow[i] != 2){
i = num + 1;
lemmeIn = 0;
} else {
lemmeIn = 1;
}
}
if (lemmeIn == 1){
window.location = mypage;
} else {
alert(pissoff);
}
}
}
//--->
</script>

第二步:把如下代码加入<body>区域中
<a href="http://www.webjx.com" onClick="gotoit(1)" target="_blank"><u>先帮忙点击这里</u></a><BR>
<a href="javascript:gotoit(num)"><u>下载本站所有页面</u></a>

posted @ 2006-08-24 01:14 穷鬼阅读(260) | 评论 (0) | 编辑收藏

JavaScript 面向对象编程, 第一部分: 继承

　　我们将向你展示 JavaScript 如何实现面向对象的语言中的: 继承. 同时, 这些例子将向你展示如何实现类的封装. 在此, 我们不会讨论多态实现.

　　虽然 JavaScript 是脚本语言, 但它所支持的面向对象编程也是非常强大的. 虽然它没有类和实例, 但它有对象, 原型和隐式的继承. 我们将会解释如何模拟继承及其超类与子类之间关系的形式. 原型是理解继承概念的关键, 我们将会教你如何建立原型, 如何检测一个对象是否是另外一个对象的原型, 及其 JavaScript 的模型与 Java 面向对象编程之间的区别. 我们同样会向你展示如何检测对象所包含的各种属性的方法. 在另外一篇文章里, 我还会详细地讲解有关 "原型链 (prototype chain)" 的知识.

　　本文大量地参考了 Webreference.com 中 "Object-Oriented Programming with JavaScript, Part I: Inheritance" 的内容, 许多内容我进行了详细的测试和再探讨, 以保证内容不会有太大的失误.
原文地址: http://www.webreference.com/js/column79/

　　面向对象语言的特点

　　面向对象设计是基于以下 3 个主要原理的: 封装, 继承和多态. 说某种程序语言是支持 OO (面向对象) 设计的, 只有在它的语法中支持以上 3 个概念才可以这么说. 这种语言应该为你提供某些方法, 以使你能很轻松地定义和使用这些范例. 封装涉及到了将某个对象变成一个 "黑盒子"的概念. 当你使用某个对象时, 你不用知道它内部是如何工作的, 你也不必理解对象是如何工作的. 这个对象只需将它绝对有用的信息以接口方式提供出来. 此对象应该给你提供友好的接口, 来让你可以使用其有限的属性集和方法集. 封装还有一层意思, 那就是说某个对象包含了它需要的每一样东西, 这包括数据和对于它的操作. 封装的概念非常的强大, 因为它允许将一个大的软件项目有效地分配给每个开发人员, 对于团队中的每个人, 他们只需要关注自己所实现的对象, 而不需要太多地关注于别人的实现. 开发项目中的开销使得开发团队中成员与接口的数量按指数级别增长. 封装是自 "软件危机" 以来最受欢迎的 OO 设计理念.

　　软件的复用是 OO 设计思想中另外一个重要的特点. 在软件体系中实现此思想的主要方法就是继承. 类就是定义对象的功能. 超类是某个新类, 或者说是子类被建立的来源类. 一个子类从它的超类中继承了所的方法和属性. 实际上, 所有的子类都是被自动地生成的, 因此节省了大量的工作. 你不需要一个一个地定义这些子类. 当然, 你可以重载那些继承下来的方法和属性. 事实上, 谁也没有指出哪个子类要建立得和其超类一模一样, 除非你没有重载任何的属性和方法.

　　多态可能是这个 3 个概念中最复杂的一个了. 其本质上是说, 每个对象都可以处理各种不同的数据类型. 你不必为处理不同的数据类型而建立不同的类. 其典型的例子就是画图的类, 你不必为实现画圆, 画矩形, 画椭圆而编写不同的类. 你可以建立一个足够聪明的类来调用特定的方法来操作特定的形状.

　　通过函数实现继承

　　虽然 JavaScript 不支持显示继承操作符, 但你可以通过其实方式实现隐式继承. 对于实现类的继承, 有 2 种比较常用的方式. 第一种将某个类定义成子类的方法是, 通过在负责定义子类函数的内部调用超类的构造函数. 看下面的示例:

// 超类构造函数
function superClass() {
this.bye = superBye;
this.hello = superHello;
}

// 子类构造函数
function subClass() {
this.inheritFrom = superClass;
this.inheritFrom();
this.bye = subBye;
}

function superHello() {
return "Hello from superClass";
}

function superBye() {
return "Bye from superClass";
}

function subBye() {
return "Bye from subClass";
}

// 测试构造特性的函数
function printSub() {
var newClass = new subClass();
alert(newClass.bye());
alert(newClass.hello());
}

　　当你运行上面的 printSub 函数时, 它会依次执行 subBuy 和 superHello 函数. 我们可以看到, bye 和 hello 方法最先在 superClass 中被定义了. 然而, 在 subClass 中, bye 方法又被重载了, subClass 构造函数头两行的功能只是做了一个简单的原始的继承操作, 但它是通过显示执行 inheritFrom 方法来完成的继承操作. 继承的过程先是将 superClass 的对象原型赋给 subClass 下的 inheritFrom 方法, 然后在执行完 superClass 的构造函数后, superClass 的属性就被自动地加到了 subClass 的属性列表中.这主要是由于在 subClass 中通过 this 来调用的 inheritFrom (也就是 superClass) 构造函数造成的, 通过此种方式调用 superClass 构造函数时, JavaScript 解释器会把 superClass 中的 this 与 subClass 中的 this 理解成位于同一个作用域下的 this 关键字, 所以就产生了继承的效果.

　　另外, 需要说明的是, 对于任何一个实例化的对象, 你任意地为它添加属性或方法, 如下所示:

var newClass = new subClass();
newClass.addprop = "added property to instance object";

　　很明显, 通过此种方式添加的属性和方法只对当前实例化对象有效, 不会影响所有的同类型对象实例. 无疑, 它是你创造的一个独一无二的对象实例.

　　通过原型实现继承

　　第二种, 也是更强大的方法是通过建立一个超类对象, 然后将其赋值给子类对象的 prototype 属性, 以此方式来建立子类的继承. 假设我们的超类是 superClass, 子类是 subClass. 其 prototype 的赋值格式如下:

subClass.prototype = new superClass;

对于原型继承的实现方式, 让我们刚前面的代码改写一下, 示例如下:

// 超类构造函数
function superClass() {
this.bye = superBye;
this.hello = superHello;
}

// 子类构造函数
function subClass() {
this.bye = subBye;
}
subClass.prototype = new superClass;

function superHello() {
return "Hello from superClass";
}

function superBye() {
return "Bye from superClass";
}

function subBye() {
return "Bye from subClass";
}

// 测试构造特性的函数
function printSub() {
var newClass = new subClass();
alert(newClass.bye());
alert(newClass.hello());
}

　　我们可以看到, 除了将前面第一种继承方式中 subClass 中的前 2 行内容, 换成函数外的 prototype 赋值语句之外, 没有其它任何的变化, 但代码的执行效果和前面是一样的.

　　为已经建立的对象添加属性

　　通过原型实现的继承比通过函数实现的继承更好, 因为它支持动态继承. 你可以在构造函数已经完成之后, 再通过 prototype 属性定义超类的其它方法和属性, 并且其下的子类对象会自动地获得新的方法和属性. 下面是示例, 你可以看到它的效果.

function superClass() {
this.bye = superBye;
this.hello = superHello;
}

function subClass() {
this.bye = subBye;
}
subClass.prototype = new superClass;

function superHello() {
return "Hello from superClass";
}

function superBye() {
return "Bye from superClass";
}

function subBye() {
return "Bye from subClass";
}

var newClass = new subClass();

/*****************************/
// 动态添加的 blessyou 属性
superClass.prototype.blessyou = superBlessyou;

function superBlessyou() {
return "Bless You from SuperClass";
}
/*****************************/

function printSub() {
alert(newClass.bye());
alert(newClass.hello());
alert(newClass.blessyou());
}

　　这就是我们经常看到的为内部对象, 如 String, Math 等再添加其它属性和方法的技巧. 对于任何的内部对象和自定义对象, 你都也可以通过 prototype 来重载其下的属性和方法. 那么在调用执行时, 它将调用你所定义的方法和属性. 下面是示例:

// 为内部 String 对象添加方法
String.prototype.myMethod = function(){
return "my define method";
}

// 为内部 String 对象重载方法
String.prototype.toString = function(){
return "my define toString method";
}

var myObj = new String("foo");

alert(myObj.myMethod());
alert(myObj);
alert("foo".toString());

　　另外需要注意的是, 所有 JavaScript 内部对的 prototype 属性都是只读的. 你可以像上面那样为内部对象的原型添加或重载属性和方法，但不能更改该内部对象的 prototype 原型. 然而, 自定义对象可以被赋给新的原型. 也就是说, 像下面这样做是没有意思的.

function Employee() {
this.dept = "HR";
this.manager = "John Johnson";
}

String.prototype = new Employee;

var myString = new String("foo");

上面的程序在运行之后不会报错, 但显然, 如果你调用 myString.dept 将会得到一个非定义的值.

另外, 一个经常使用的是 prototype 下的 isPrototypeOf() 方法, 它主要用来判断指定对象是否存在于另一个对象的原型链中. 语法如下:

object1.prototype.isPrototypeOf(0bject2);

上面的格式是用来判断 Object2 是否出现 Object1 的原型链中. 示例如下:

function Person() {
this.name = "Rob Roberson";
this.age = 31;
}

function Employee() {
this.dept = "HR";
this.manager = "John Johnson";
}

Employee.prototype = new Person();

var Ken = new Employee();

当执行 Employee.prototype.isPrototypeOf(Ken), Person.prototype.isPrototypeOf(Ken) 和 Object.prototype.isPrototypeOf(Ken) 时, 结果都会返回 true.

　　用于 Netscape 下的特定继承检测

　　在 Netscape 浏览器 4.x 到 6, 及其 Mozilla 系列浏览中, JavaScript 将对象间的原型关系存储在一个特殊的内部属性对象中, __proto__ (前后是 2 个下划线). 下面是一个示例:

function Shape() {
this.borderWidth = 5;
}

function Square() {
this.edge = 12;
}

Square.prototype = new Shape;

myPicture = new Square;

alert(myPicture.__proto__);
alert(myPicture.borderWidth);

　　由于脚本执行过 Square.prototype = new Shape 语句, 所以 myPicture 具有了一个指向 Shape 对象的内部属性 __proto__. 在脚本的执行过程中, 当要获取对象的某个属性值, 并且此对象是通过原型赋值而建立的某个对象, 在自身并没有对某个属性进行定义时, JavaScript 解析器会查看它的 __proto__ 属性对象, 也就它的原型对象, 然后枚举其原型中的所有属性, 而得出的结果要么是有这个属性, 要么是没有这个属性. 如果没有此属性, 再枚举原型对象下面的原型对象, 直到此过程真正的结束. 而所有的这些 JavaScript 引擎内部的操作, 我们是不会知道的, 下面的内容就是对这个问题的解释.

　　其实, 对于所有的自定义对象, 无论它有没有使用过 prototype 赋值操作, 它都具有一个 __proto__ 内部对象. 而如果某个对象是通过多层 prototype "继承" 来的, 所有的 "继承" 而来的属性却可以通过简单的一层循环遍历出来, 而不需要使用什么递归算法, 因为 JavaScript 引擎自动给我们做了. 示例如下:

function Shape() {
this.borderWidth = 5;
}

function Square() {
this.edge = 12;
}

function RoundSquare()
{
this.radio = 0.5;
}

Square.prototype = new Shape;
RoundSquare.prototype = new Square;

var myPicture = new RoundSquare;

for (property in myPicture.__proto__) {
alert(property);
}

　　我们或者还可以通过更改后面的循环, 来遍历某个子类对象继承来的所有属性, 如下:

for (property in RoundSquare.prototype) {
alert(property);
}

　　如果你不怕麻烦, 我们甚至还可以通过级连的方式, 取出其构造函数中定义的原始属性值.

alert(myPicture.__proto__.__proto__.borderWidth);

　　无论你是否修改过此属性值, 通过上面语句所取出的属性值都是原始定义值. 让我们沿着这个思路再往下看, 下面的代码涉及到另外一个问题, 这个问题和原型链 (prototype chain) 有关. 代码如下:

function State() {
}

function City() {
}
City.prototype = new State;

function Street() {
}

Street.prototype = new City;

var UniversityAvenue = new Street();

function tryIt() {
alert(UniversityAvenue.__proto__== Street.prototype);
alert(UniversityAvenue.__proto__.__proto__==
   City.prototype);
alert(UniversityAvenue.__proto__.__proto__.__proto__
   == State.prototype);
alert(UniversityAvenue.__proto__.__proto__.__proto__.
   __proto__== Object.prototype);
alert(UniversityAvenue.__proto__.__proto__.__proto__.
   __proto__.__proto__== null);
}

　　当执行 tryIt 函数时, 所有的显示均为 true. 也就是说, 子类对象的 prototype.__proto__ 总是等于超类对象的 prototype 属性; 超类对象的 prototype.__proto__ 总是等于 Object.prototype; Object.prototype.__proto__ 总是为 null; 而实例对象的 __proto__ 总是等于其类对象的 prototype, 这就是为什么任何自定义对象都具有 __proto__ 属性的原因. 对于上面的叙述, 其对应的代码如下:

Street.prototype.__proto__ == City.prototype     // true
State.prototype.__proto__ == Object.prototype    // true
Object.prototype.__proto__ == null               // true
UniversityAvenue.__proto__ == Street.prototype    // true

　　模拟实现 instanceOf 函数

　　根据上一节的内容, 我们了解了有关 Netscape 所支持的 __proto__ 特性的内容. 这一节, 我们将利用此特性来创建自己的实例对象检测函数.

　　许多时候, 我们都需要判断某个对象是否是由某个类来定义的, 在其它的语言里, 你可以通过 instanceOf 函数来实现此判断. 在 JavaScript 中同样提供了一个 instanceof 运行符, 而在 __proto__ 的基础上, 我们完全可以自己定义一个同样的函数, 虽然这看上去是在重复劳动, 但有助于我们更深刻地了解有关 __proto__ 的知识. 下面的代码只是用来说明功能, 在实际的应用中, 你不需要重复定义 instanceOf 函数, 使用 instanceof 运算符即可.

function instanceOf(object, constructorFunction) {
while (object != null) {
    if (object == constructorFunction.prototype)
     {return true}
    object = object.__proto__;
}
return false;
}
function State() {
}

function City() {
}
City.prototype = new State;

function Street() {
}

Street.prototype = new City;

var UniversityAvenue = new Street();
function demo() {
alert("instanceOf(UniversityAvenue, Street) is " +
   instanceOf(UniversityAvenue, Street));
alert("instanceOf(UniversityAvenue, City) is " +
   instanceOf(UniversityAvenue, City));
alert("instanceOf(UniversityAvenue, State) is " +
   instanceOf(UniversityAvenue, State));
}

　　你会看到所有的运行结果全部为 true, 其原理和上一节的级连判断相等如出一辙. 实际证明, 它的运行结果和 instanceof 运行符的运行结果是一致的.

　　你可以通过 constructor 属性来检测任意对象的超类, 此属性返回通过 new 运算符创建新对象时所调用的构造函数, 返回值是 Function 对象类型. 因为 Object 内部对象是支持 constructor 属性的, 并且有的对象 (包括内部对象和自定义对象) 都是由 Object 继承而来的, 所以所有的对象都支持此属性. 让我们再看一下下面的例子:

function Employee() {
this.dept = "HR";
this.manager = "John Johnson";
}

function printProp() {
var Ken = new Employee();
alert(Ken.constructor);
}

　　调用完 printProp 函数之后, 你会看到弹出框中显示的是 Employee 函数的定义文本, 其实 Ken.constructor 的返回值本身是 Function 对象类型, 而在 alert 时被隐含地调用了 toString 方法. 对于类对象本身, 你同样可以调用 prototype.constructor 来取出其构造函数.

　　对象的分类和打印

　　JavaScript 支持 3 种主要类型的对象: 内部对象, 宿主对象, 自定义对象, 可能还有特殊的外部对象, 如: ActiveX 对象或 XPCOM 对象. 内部对象被 JavaScript 语言本身所支持, 如: Object, Math, Number 对象等. 所有的内部对象的共同特点是以大写字母开头, 并且它们是大小写敏感的. 如果你想使用数学常量 PI, 必须写成 Math.PI, 你如果写成 math.PI, JavaScript 会显示错误. 宿主对象是被浏览器支持的, 目的是为了能和被浏览的文档可以交互, 如: document, window 和 frames. 宿主对象的特点是所有对象全部以小写字母开头. 因为 JavaScript 本身就是大小写敏感的, 所以你同样不能将大小写搞混. 剩下要说的就只是自定义对象了, 你可以随便将你的对象定义成小写或大小写, 但是一定要符合基本的命名规范. 如下所示, 这就是一个自定义对象:

function employee() {
this.dept = "HR";
this.manager = "John Johnson";
}

function printProp() {
var ken = new Employee();
for (property in ken) {
alert(property);
}
}

　　前面我们已经提到过, 所有的内部对象和自定义对象都是从 Object 对象继承而来的, 它是所有对象的超类对象. 你可建立一个 Object 对象的实例. 如下:

var myObject = new Object();

　　Object 类型的对象有许多的属性和方法, 你可以查看相关的手册. 上面只是定义了一个最简单的空对象, 你还可以为 Object 构造函数传入参数, 它会返回相应类型值的实例化对象. 记住, 返回值的类型是某种对象类型的 (如: String, Number 或 Object). 这种方式和直接通过赋值字符串或数值常量不同, 主要表示在类型方面. 如下所示:

var myObject = new Object("foo"); // 返回值类型为 object
var myObject = new String("foo"); // 返回值类型为 object, 效果同上
与
var myObject = "foo"; // 返回值类型为 string

　　你可以从调试器的 type 列中看出这个细微的差别, 它是简单类型与对象类型之间的区别. 但是, 你通过 alert 调用是看出不这些内部差别的, 因为在调用 alert 的过程中, 所有的对象类型值都会被自动调用 toString 方法进行字符串类型转换, 转换规则在 JavaScript 手册中有说明. 如果你 alert 的是某个自定义对象, 并且它没有定义 toString 方法, 那么它的返回值将为 "[object Object]". 对于 Math 对象, 当你查看其 Math.constructor 属性时, 你会得到一个不同于其它内部对象的内容为 "function Object()..." 的对象构造函数, 这与其它对象返回 "function Function()..." 的构造函数很不相同. 原因很简单, 因为 Math 对象是不能通过 new 运算符进行创建的.

　　另外, 如果传入 Object 构造函数中的值是一个对象, 它将原封不动地将该对象返回. 记住, 此操作只是一个引用, 而不是复制.

　　请求对象的属性

　　在前面的示例代码中, 已经出现过以循环方式枚举对象属性的示例. 其实, 通过 for...in 语句, 无论是任何对象和数组, 其下的元素, 属性和方法都可以遍历出来. 示例如下:

function employee() {
this.dept = "HR";
this.manager = "John Johnson";
}

function printProp() {
var ken = new employee();
for (property in ken) {
alert(property + " : " + ken[property]);
}
}

　　在遍历测试过程中, 你会发现, 对于自定义对象和宿主对象一般都可以枚举出其下的属性, 而对于内部对象, 几乎没有什么属性可以遍历出来, 为什么要说几乎呢? 因为对于 Mozilla 内核的浏览和 IE 内核的浏览器, 其 JavaScript 引擎有不同, Mozilla 下可以枚举出部分内容, 而枚举的原则不得而知.

　　对于每一个对象, 你还可以使用 hasOwnProperty 方法来检测其是否具有某个属性或方法. 由于 hasOwnProperty 是 Object 对象下的方法, 因此所有的对象都具有此方法. 但是, 需要注意的是, 此方法只能检测通过 this 关键字定义的成员, 如果某个成员是通过原型链定义的, 那么此方法将返回 false. 也就是说, 通过 prototype 继承来的属性和方法, 及其通过 prototype 定义的属性和方法, 都是不能通过 hasOwnProperty 来进行检测的. 由此, 我们可以看出, 通过 this关键字定义的属性和方法是同对象本身处于同一个地址空间内的; 而通过 prototype 定义的属性和方法, 是通过所谓的 "原型链" 进行管理的, 其下的的属性和方法不位于同一个地址空间之间, 当其调用这种属性或方法时, 必须通过 "链表" 才能索引到其下的某个属性或方法. 也就说, 调用以原型方式定义的属性和方法会有一个类似于链表的 "回溯" 操作.

　　和 hasOwnProperty 差不多, 对于对象中的每个属性, 我们还可以通过 propertyIsEnumerable 来测试它是否可以被枚举出来. 如下所示:

function Employee1() {
this.dept = "HR";
this.manager = "John Johnson";
this.month = new Array("jan", "feb", "mar");
}

var Ken = new Employee1();

Ken.month.propertyIsEnumerable(0);

　　我们可以看到, 其语法是 propertyIsEnumerable 后跟数组的元素索引或对象中的属性名称. 同样, 对于原型链中的属性或方法它是不予考虑的, 结果当然是返回 false.

　　对于 JavaScript 和 Java 的比较

　　与 Java 这种基于类的语言不同, JavaScript 是一种基于原型的语言. 这种特点影响着每一个方面. 如术语 instance 在基于类的语言中有着特殊的意义, 它表示某个实例是隶属于某个特殊类的独立个体, 是对类定义的真实实现; 而在 JavaScript 中, 术语 instance 没有这个意思, 因为在它的语法里面, 类和实例是没有区别的. 虽然, 实例可以用来说明某个对象是使用某个特殊的构造函数生成的. 如下所示:

function superClass() {
this.bye = superBye;
this.hello = superHello;
}

function subClass() {
this.bye = subBye;
}
subClass.prototype = new superClass;

function superHello() {
return "Hello from superClass";
}

function superBye() {
return "Bye from superClass";
}

function subBye() {
return "Bye from subClass";
}

var newClass = new subClass();

newClass 是 subClass 的实例, 它是通过 subClass 的构造函数生成的. 而如果使用基于类的语言呢, 如下所示是 Java 的等价实现.

public class superClass {
public superClass () {
    this.bye = superBye;
    this.hello = superHello;
}
}
public class subClass extends superClass {
public subClass () {
    this.bye = subBye;
}
}

　　结束语

　　我们在上面的几节中, 详细地说明了有关 JavaScipt 中的面向对象实现, 或者只能说是模拟实现. 在此期间向你展示了实现方法. 并且阐述了有关如何检测对象之间关系的方法, 如何打印属性和测试某个特定的属性, 还做了一个 JavaScript 和 Java 的简单比较. 但这显然是不够的, 因而, JavaScript 的面向对象编程是非常多样化的, 格式也非常繁杂. 我打算在后面的内容里, 再总结一下有问封装的格式问题, 着重说明与对象方法有关的内容和实现, 同时还有上面提到的原型链 (prototype chain) 问题.

posted @ 2006-08-24 01:12 穷鬼阅读(234) | 评论 (0) | 编辑收藏

setTimeout 和 setInterval 的区别

　　window对象有两个主要的定时方法，分别是setTimeout 和 setInteval 他们的语法基本上相同，但是完成的功能取有区别。

　　setTimeout方法是定时程序，也就是在什么时间以后干什么。干完了就拉倒。

　　setInterval方法则是表示间隔一定时间反复执行某操作。

　　如果用setTimeout实现setInerval的功能，就需要在执行的程序中再定时调用自己才行。如果要清除计数器需要根据使用的方法不同，调用不同的清除方法：

例如：tttt=setTimeout('northsnow()',1000);

clearTimeout(tttt);

或者：

tttt=setInterval('northsnow()',1000);

clearInteval(tttt);

举一个例子：

或者：

posted @ 2006-08-24 01:11 穷鬼阅读(220) | 评论 (0) | 编辑收藏

用JavaScript绘图—JS2D函数集

posted @ 2006-08-24 01:09 穷鬼阅读(196) | 评论 (0) | 编辑收藏

Javascript: 关注JSVM

JSVM-介绍

   我们在 JSVM1.x 中尝试了一种较传统方式不同的 JavaScript（基于web中的JS）开发模式。一年多的时间中，得到了大量积极有效的反馈和建议，在这些基础上今天我们正式推出 JSVM2。
    JavaScript 一直以来扮演着Web端“小脚本”的角色，开发者用它来在web上制作一些动态特效，? 以及表单提交前对数据的预校验等等，随着客户端处理能力日益提升，DHTML在表示层的动态特征和丰富表现力，以及XmlHttp,XmlDom等HTTP工具的出现, 另外一种应用模式开始引起人们的关注：基于 JavaScript + DHTML + XML + XmlHttp/XmlDom 的 RIA (Rich Internet Application)，更确切地说，应称为：RWA (Rich Web Application)。这类应用给用户带来的良好体验远胜于传统 Web 中依赖 Form 提交数据的方式，并且较大程度减小了服务器的负载和网络流量，提高了系统综合性能。后来一个老外提出了 Ajax 这个名词，关于这个概念我不再冗余复述。
    如今Ajax Framework 像雨后春笋一般涌现很多，其中不乏优秀之作。但在此并不多作介绍。因为 JSVM 和他们定位不同，JSVM不仅仅是一个 Ajax 框架，也并非仅仅为了实现 Ajax 而产生。它作为一个更底层更抽象的 JavaScript 框架，为我们实现类似Ajax应用提供了一个基础平台。我曾经拿jsvm1到51js上与许多js爱好者共同讨论，其中有两种比较典型的不同看法是：

JavaScript 需要框架吗，是不是把简单的事情复杂化了? 短小精干才是脚本之道。
非要借鉴 JAVA 的架构吗？是否有更好的解决方案。
    对于第一种意见，我认为某种条件下还是有道理的。例如：我仅仅是想打印一句 Hello, world! 直接 alert()就可以了，何必要弄一个 Framework 出来，岂非劳民伤财，小题大做。确实，对于一些简单的web应用，js 在整个体系中充当的角色很小，我觉得是可以不用框架的。但对于一个RIA模式的Web应用，尤其是企业级的应用，系统复杂程度和JS代码规模相当庞大的情况下，没有框架带来的后果是可以预见的。对于第二种观点：赞成框架的必要性，但对jsvm一些“模仿”java的做法抱有怀疑态度。我不能说这种看法不对，也许确实有更好API架构。但是，本人认为这个不是关键所在，jsvm提供了对多种语法解析器的支持，有兴趣的人完全可以根据自己喜好在jsvm下开发出另外一套API。类C#,类VB的语法都可以实现。
    简单的说，JSVM 根本目的是为了规范浏览器端JavaScript脚本开发，更好的实现代码复用。传统面向过程型的JavaScript开发方式已经明显不能满足大规模软件开发的需要。大部分迹象表明? 随着 RIA 的发展，客户端都将承担更多的逻辑处理工作，企业级应用的代码规模和复杂度都是相当大的。有效的代码组织结构，合理的模块粒度，低耦合高内聚的设计原则等等如何引入到JavaScript的开发上来？相信当你了解 JSVM2 之后，会有一些答案。
    作为一个框架，JSVM要解决的问题不是提供某一种应用的解决方案，而是针对各种场景提供广泛的支持。另外一个需要说明的是：jsvm2并不是jsvm1的一个升级版，几乎是在jsvm1上完全重构。且不提供对原jsvm1.x中的类的支持。（当然，原jsvm1.x下的类需要经过做一些小改动即能在jsvm2下正常工作）较jsvm1.x，jsvm2 有了几处明显的变化：

性能上有了明显的提升。
每个类文件拥有独立的语法域。
几种常见的web运行模式在Framework中将直接被支持。
编译引擎支持多语法解析器，并缺省提供了一个名为"jsvm2"的语法解析器。从语法层面提供了一些OO关键字的支持，使jsvm下的面向对象的javascript开发更为直观和方便。
具有更灵活的扩展性。二次开发者可以很方便的扩展其功能。

posted @ 2006-08-24 01:06 穷鬼阅读(283) | 评论 (0) | 编辑收藏

经典的《JavaScript 权威指南》中的“对象”不经典

这些天在为Qomo项目写“JavaScript面向对象的支持”这组文章。也一直在期待网上购得的那本《JavaScript 权威指南》(第四版)快快到来。

在前公司，有这本书的第二或第三版，也一直将这本书视为经典。但那时并没有深入的去看它前几章的概念性叙述，而是把它当成一本手册来查。现在却刻意地关注了，因为Qomo的底层是以纯理论的OOP为基础的。

今天这本书终于寄到了，但是一读之下，大失所望。不知道作者对JavaScript语言的理解能力不够，还是他对OOP的理解不够。《JavaScript权威指南》这本书对面向对象的叙述不但不专业，而且还错误百出。实在不值一看。

试举几例：

× JavaScript没有正式的类的概念，……，它用构造函数和原型对象模拟了类
事实上，JavaScript的确没有正式的类的概念，但模拟类的只是构造函数而不是类。因为类是“声明”，对象是实体。用“实体”去模拟“声明”原本就说不通。在JScript中，类的检测是通过对构造函数来进行的，而不是一种基于原型的检测。

× JavaScript中的实例属性是那些在对象中用构造函数创建的或初始化的属性
这个问题出现在所谓的“实例属性”还有一种与构造函数无关的情况，也就是直接对原型属性声明。例如“MyObject.prototype.prop_1 = 'abcd'”，因此上面这种定义是不完整的。

×类属性与类方法
JavaScript中没有“类”，因此也没有类属性与类方法。只不过构造器(函数)也被对象系统理解为“对象”，因此构造器也可以创建新的属性和方法。——这只是它作为一个“单独的对象实例”的特性而已，把这个作为类属性和类方法，很不合逻辑。

类似这样的问题非常之多，显得作者的逻辑很混乱。作者甚至没有办法为读者理清脚本环境与DOM环境的异同，这在第四章关于局部变量、执行环境和作用域等问题的讨论中(4.6~4.7节)尤其突出。

因此，我相信没有多少人能读明白这本书有关JavaScript中对象系统的描述。此外，这本书将JavaScript、DOM和CSS这几种不同层次的体系揉到一起来讲述，尽管使这本书内容显得更为丰富而且刺激了购买，然而也使读者不得不在几个不同的泥坑中跳来跳去，最终无所适从。

因此作为建议，最好是把这本书当成一本手册来查阅，而不是当作理论上的经典。随便说一点，这不是翻译的过错，而真的是作者的问题。

出自同一家出版社的《Delphi技术手册》的翻译被一些人骂得很惨，但事实上是读不懂书的人在胡言。——那本书的翻译得是非常精道的，一些看似拗口的译文其实很精准，多读两遍就懂了。与此相较，这本《JavaScript权威指南》的作者，看起来对“JavaScript的对象系统”就未必深彻地了解和思考过了。

posted @ 2006-08-24 01:06 穷鬼阅读(168) | 评论 (0) | 编辑收藏

JavaScript精简学习3：图像

36 读取图像属性
1: <img src=”image1.jpg” name=”myImage”>
2: <a href=”# ” onClick=”window.alert(document.myImage.width)”>Width</a>
3:

37 动态加载图像
1: <script language=”JavaScript”>
2: myImage = new Image;
3: myImage.src = “Tellers1.jpg”;
4: </script>

38 简单的图像替换
1: <script language=”JavaScript”>
2: rollImage = new Image;
3: rollImage.src = “rollImage1.jpg”;
4: defaultImage = new Image;
5: defaultImage.src = “image1.jpg”;
6: </script>
7: <a href=”myUrl” onMouseOver=”document.myImage.src = rollImage.src;”
8: onMouseOut=”document.myImage.src = defaultImage.src;”>
9: <img src=”image1.jpg” name=”myImage” width=100 height=100 border=0>

39 随机显示图像
1: <script language=”JavaScript”>
2: var imageList = new Array;
3: imageList[0] = “image1.jpg”;
4: imageList[1] = “image2.jpg”;
5: imageList[2] = “image3.jpg”;
6: imageList[3] = “image4.jpg”;
7: var imageChoice = Math.floor(Math.random() * imageList.length);
8: document.write(‘<img src=”’ + imageList[imageChoice] + ‘“>’);
9: </script>

40 函数实现的图像替换
1: <script language=”JavaScript”>
2: var source = 0;
3: var replacement = 1;
4: function createRollOver(originalImage,replacementImage) {
5: var imageArray = new Array;
6: imageArray[source] = new Image;
7: imageArray[source].src = originalImage;
8: imageArray[replacement] = new Image;
9: imageArray[replacement].src = replacementImage;
10: return imageArray;
11: }
12: var rollImage1 = createRollOver(“image1.jpg”,”rollImage1.jpg”);
13: </script>
14: <a href=”#” onMouseOver=”document.myImage1.src = rollImage1[replacement].src;”
15: onMouseOut=”document.myImage1.src = rollImage1[source].src;”>
16: <img src=”image1.jpg” width=100 name=”myImage1” border=0>
17: </a>

41 创建幻灯片
1: <script language=”JavaScript”>
2: var imageList = new Array;
3: imageList[0] = new Image;
4: imageList[0].src = “image1.jpg”;
5: imageList[1] = new Image;
6: imageList[1].src = “image2.jpg”;
7: imageList[2] = new Image;
8: imageList[2].src = “image3.jpg”;
9: imageList[3] = new Image;
10: imageList[3].src = “image4.jpg”;
11: function slideShow(imageNumber) {
12: document.slideShow.src = imageList[imageNumber].src;
13: imageNumber += 1;
14: if (imageNumber < imageList.length) {
15: window.setTimeout(“slideShow(“ + imageNumber + “)”,3000);
16: }
17: }
18: </script>
19: </head>
20: <body onLoad=”slideShow(0)”>
21: <img src=”image1.jpg” width=100 name=”slideShow”>

42 随机广告图片
1: <script language=”JavaScript”>
2: var imageList = new Array;
3: imageList[0] = “image1.jpg”;
4: imageList[1] = “image2.jpg”;
5: imageList[2] = “image3.jpg”;
6: imageList[3] = “image4.jpg”;
7: var urlList = new Array;
8: urlList[0] = “http://some.host/”;
9: urlList[1] = “http://another.host/”;
10: urlList[2] = “http://somewhere.else/”;
11: urlList[3] = “http://right.here/”;
12: var imageChoice = Math.floor(Math.random() * imageList.length);
13: document.write(‘<a href=”’ + urlList[imageChoice] + ‘“><img src=”’ + imageList[imageChoice] + ‘“></a>’);
14: </script>

posted @ 2006-08-24 01:04 穷鬼阅读(146) | 评论 (0) | 编辑收藏

深入研究JScript语法——常量和变量

例子：

前面的例子中：

return "<font color=gray>"+hit+"</font>"

使用了变量和常量，"<font color=gray>"和"</font>"是文本常量，hit是变量。

加号(+)则将三者加成一个文本："<font color=gray>100</font>"，如果hit为100的话。

　

数值常量

    这个很简单，上过数学课的都应该知道如何表示数字，JScript中没有任何特别。

123
0
-100
100.123
1E3        (1000)

都是合法的数字常量

文本常量

    这个用的最多，因为经常要动态的生成HTML文本。常量必须用引号括起来：

"abc"

"123"

"文本常量"

都是合法的文本常量，为什么要用引号？完全没有编程经验的人可能会有些疑惑，其实很简单，
计算机需要把常量和变量区别开。

变量赋值

    a = "abc"

变量a的值为"abc"了。为什么比较时要用==，为了和赋值区别开呀！

    b = a + "123"

变量b的值为"abc123"了。如果常量不加引号如何和变量区别呢？

    b = "a" + "123"

变量b的值为"a123"

　

那么如果文本中包含引号如何？比如如何表示：

<input type=button value="A A">

因为按钮的名称里有空格，那么必须用双引号括起来，如何表示这个文本常量？

JScript还可以使用单引号：

'<input type=button value="A A">'

在单引号中就可以直接使用双引号了。反过来在双引号括起来的常量里可以直接使用单引号。

"<input type=button value='A A'>"

那么当常量里两个引号都有该怎么办？这就需要使用转义符号反斜杠\

"abc'def\"ghi"

在常量中可以用“\"”来表示一个双引号。而且还有：

\r\n        表示回车
\\          表示一个反斜杠

　

　

function myname(name){

    if (name=="小青"){
       document.write("<input type=button value='隐藏小青' onclick=\"mytext.style.display='none'\">")
    }
    else
       document.write(name)

}

上面的函数，当输入name为“小青”时，输出：

<input type=button value='隐藏' onclick="mytext.style.display='none'">

　

变量定义

    JScript中可以不预先定义变量就直接使用，但是这样往往会带来潜在问题，
所以建议大家使用变量前都先定义好。

    变量有两种类型，定义在函数内部的为局部变量。

<script>
function myfunc(){

//变量定义使用var，下面定义了变量a
var a

//可以一次定义多个变量，用逗号分开
var i,j,k

//定义的时候还可以给变量赋初值
var a="acb"

var a=123,b="ddd"

}
</script>

局部变量只在函数内有效，离开函数该变量就不存在了。

如果定义在函数外则为全局变量：

<script>
//定义一个全局变量a
var a
</script>

该变量在所有函数内外都将有效，除非函数内定义了一个相同名称的变量

<script>
//定义全局变量a
var a=100

function myfunc(){

var a="abc"

//函数输出的是abc，函数内的变量屏蔽了同名全局变量
document.write(a)

}
</script>

如果不使用var来定义，那么变量是全局变量。因此如果你不明确定义变量在使用，
就可能误用了全局变量，比如：

<script>
//定义全局变量a
var a="dddd"

...

function myfunc(){
    //函数内只想使用一个临时的变量保存返回结果
    a=b+...

    ...

    return a

}
</script>

那么一旦执行过myfunc，则原先的全局变量的值就被破坏了，这就可能引起其实使用
该全局变量的程序出错！因此强烈建议大家都明确定义变量，而且尽量少使用全局变量。

posted @ 2006-08-24 01:04 穷鬼阅读(177) | 评论 (0) | 编辑收藏

撕页广告代码及简介

<script>
<!--
//setTimeout("BigWinGecko_DoFSCommand()",0);
var InitBigWinSrc = "image/photo350";//撕页开始广告路径，为形式的而已；
var InitBigWinWidth = "250";
var InitBigWinHeight = "251";
var InitLittleWinSrc = "image/photo350";//撕页开始广告路径，为形式的而已；
var InitLittleWinWidth = "80";
var InitLittleWinHeight = "80";
var InitUseCookieHours = 24;

//不对Netscape4.0老版本提供完整支持。
var NavName = (document.all)? "IE":"Gecko";
var isFirstTime = true;
var RightSuspent = (screen.width>800)?1004:770;

function _GetFullScreenCookieVal(offset) {
  var endstr = documents.cookie.indexOf (";", offset);
  if (endstr == -1)
  endstr = documents.cookie.length;
  return unescape(documents.cookie.substring(offset, endstr));
}

function _SetFullScreenCookie (name, value) {
  var argv = _SetFullScreenCookie.arguments;
  var argc = _SetFullScreenCookie.arguments.length;
  var expires = (argc > 2) ? argv[2] : null;
  var path = (argc > 3) ? argv[3] : null;
  var domain = (argc > 4) ? argv[4] : null;
  var secure = (argc > 5) ? argv[5] : false;
  documents.cookie = name + "=" + escape (value) +
  ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
  ((path == null) ? "" : ("; path=" + path)) +
  ((domain == null) ? "" : ("; domain=" + domain)) +
  ((secure == true) ? "; secure" : "");
}

function BigWinGecko_DoFSCommand(command,args){
var BigWinOBJ = document.getElementById("BigWinDiv");
var LittleWinOBJ = document.getElementById("LittleWinDiv");
BigWinOBJ.style.visibility = "hidden";
if (isFirstTime){
  LittleWinOBJ.style.display = "block";
  isFirstTime = false;
  return;
}
LittleWinOBJ.style.visibility = "visible";
}

function LittleWinGecko_DoFSCommand(command,args){
var BigWinOBJ = document.getElementById("BigWinDiv");
var LittleWinOBJ = document.getElementById("LittleWinDiv");
var PlayWinOBJ = document.getElementById("BigWin"+NavName);
LittleWinOBJ.style.visibility = "hidden";
BigWinOBJ.style.visibility = "visible";
PlayWinOBJ.Play();
}

if (NavName == "IE"){
document.write("<Scr"+"ipt language=\\"javascript\\" For=\\"BigWinIE\\" Event=\\"FSCommand(command,args)\\">\\n");
document.write(" BigWinGecko_DoFSCommand(command,args);\\n");
document.write("</Scr"+"ipt>");
document.write("<Scr"+"ipt language=\\"javascript\\" For=\\"LittleWinIE\\" Event=\\"FSCommand(command,args)\\">\\n");
document.write(" LittleWinGecko_DoFSCommand(command,args);\\n");
document.write("</Scr"+"ipt>");
}

if (InitBigWinSrc&&InitBigWinWidth&&InitBigWinHeight&&InitLittleWinSrc&&InitLittleWinWidth&&InitLittleWinHeight){
WriteObj("BigWin",InitBigWinSrc,InitBigWinWidth,InitBigWinHeight);
WriteObj("LittleWin",InitLittleWinSrc,InitLittleWinWidth,InitLittleWinHeight);
if (_CheckCookie("TurnBook")){
BigWinGecko_DoFSCommand("turnbook","big");
}
}

LittleWinGecko_DoFSCommand("FSCommand","www");

setTimeout("BigWinGecko_DoFSCommand()",30000);

//-->
</script>

posted @ 2006-08-24 01:03 穷鬼阅读(468) | 评论 (1) | 编辑收藏

Javascript 滚动新法

　　我想大家都看过各种各样的滚动（最常用的就是用在新闻的更新上面），一般情况下只要不是图片，都是用HTML本身就有提供一个很不错的滚动标记——marquee来完成的（用JS也可以同样实现这种效果）；当然并不是说图片就不能那样做。
　　以下为marquee的一些基本的参数：
　　该标记语法格式如下：
<marquee
aligh=left|center|right|top|bottom
bgcolor=#n
direction=left|right|up|down
behavior=type
height＝n
hspace＝n
scrollamount=n
Scrolldelay=n
width=n
VSpace=n
loop＝n>内容</marquee>

　　下面解释一下各参数的含义：
　　align：是设定活动字幕的位置，除了居左、居中、居右三种位置外，又增加靠上（top）和靠下（bottom）两种位置。
　　Bgcolor：用于设定活动字幕的背景颜色，可以使用英文的单词也可以是十六进制数的。
　　Direction：用于设定活动字幕的滚动方向是向左（left）、向右（right）、向上（up）、向下（down）。
　　Behavior：用于设定滚动的方式，主要由三种方式：
behavior="scroll"表示由一端滚动到另一端；
behavior="slide":表示由一端快速滑动到另一端，且不再重复；
behavior="alternate"表示在两端之间来回滚动。
　　Height：用于设定滚动字幕的高度。
　　Width：则设定滚动字幕的宽度。
　　Hspace和vspace：分别用于设定滚动字幕的左右边框和上下边框的宽度。
　　Scrollamount：用于设定活动字幕的滚动距离。数值越小，滚动的速度就越快。
　　scrolldelay：用于设定滚动两次之间的延迟时间，数值越小，间隔就越小。
　　Loop：用于设定滚动的次数，当loop=-1表示一直滚动下去，直到页面更新。其中默认情况是向左滚动无限次，字幕高度是文本高度；滚动范围：水平滚动的宽度是当前位置的宽度；垂直滚动的高度是当前位置的高度。

　　现在要介绍的是一种新型的滚动，利用JS的方法来做字幕的滚动：向上，在中间停顿一到两秒（就像经典的这种）：
　　将以下代码贴到您要显示的位置就可以了：
<script>
var marqueeContent=new Array(); //定义一个数组，用来存放显示内容
marqueeContent[0]='<A href="#" onclick="reinitMarquee()">刷新最新列表</FONT></A>';
marqueeContent[1]='<a href=http://www.blueidea.com/updatelist.asp target=_blank>站点最新更新六十条</a>';
marqueeContent[2]='<A href=http://www.blueidea.com/tech/graph/2003/875.asp target=_blank>羽毛效果制作教程</a>';
marqueeContent[3]='<A href=http://www.blueidea.com/tech/program/2003/831.asp target=_blank>MySQL＆ASP</a>';
marqueeContent[4]='<A href=http://www.blueidea.com/tech/web/2003/874.asp target=_blank>初步了解CSS3</a>';
marqueeContent[5]='<A href=http://www.blueidea.com/tech/graph/2003/864.asp target=_blank>Fireworks MX 2004执行面版操作</a>';
marqueeContent[6]='<A href=http://www.blueidea.com/tech/graph/2003/872.asp target=_blank>Fireworks MX 2004等高渐变填充</a>';
marqueeContent[7]='<A href=http://www.blueidea.com/photo/gallery/2003/873.asp target=_blank>瓶子里的花</a>';
marqueeContent[8]='<A href=http://www.blueidea.com/tech/graph/2003/871.asp target=_blank>Fireworks MX 实现选项卡式效果</a>';
marqueeContent[9]='<A href=http://www.blueidea.com/photo/gallery/2003/870.asp target=_blank>情侣：黑白的爱情空气</a>';
marqueeContent[10]='<A href=http://www.blueidea.com/tech/graph/2003/866.asp target=_blank>制作 MAC 风格的苹果标志</a>';
marqueeContent[11]='<A href=http://www.blueidea.com/tech/graph/2003/868.asp target=_blank>蛋壳制作及破壳而出的人物合成</a>';

var marqueeInterval=new Array(); //定义一些常用而且要经常用到的变量
var marqueeId=0;
var marqueeDelay=4000;
var marqueeHeight=16;

//接下来的是定义一些要使用到的函数
Array.prototype.random=function() {
var a=this;
var l=a.length;
for(var i=0;i<l;i++) {
var r=Math.floor(Math.random()*(l-i));
a=a.slice(0,r).concat(a.slice(r+1)).concat(a[r]);
}
return a;
}
function initMarquee() {
marqueeContent=marqueeContent.random();
var str='';
for(var i=0;i<Math.min(3,marqueeContent.length);i++) str+=(i>0?'　　':'')+marqueeContent[i];
document.write('<div id=marqueeBox style="overflow:hidden;height:'+marqueeHeight+'px" onmouseover="clearInterval(marqueeInterval[0])" onmouseout="marqueeInterval[0]=setInterval(\'startMarquee()\',marqueeDelay)"><div>'+str+'</div></div>');
marqueeId+=2;
if(marqueeContent.length>3)marqueeInterval[0]=setInterval("startMarquee()",marqueeDelay);
}
function reinitMarquee() {
js_scroll_content.src='scroll_content2.js';
marqueeContent=marqueeContent.random();
var str='';
for(var i=0;i<Math.min(3,marqueeContent.length);i++) str+=(i>0?'　　':'')+marqueeContent[i];
marqueeBox.childNodes[(marqueeBox.childNodes.length==1?0:1)].innerHTML=str;
marqueeId=2;
}
function startMarquee() {
var str='';
for(var i=0;(i<3)&&(marqueeId+i<marqueeContent.length);i++) {
str+=(i>0?'　　':'')+marqueeContent[marqueeId+i];
}
marqueeId+=3;
if(marqueeId>marqueeContent.length)marqueeId=0;

if(marqueeBox.childNodes.length==1) {
var nextLine=document.createElement('DIV');
nextLine.innerHTML=str;
marqueeBox.appendChild(nextLine);
}
else {
marqueeBox.childNodes[0].innerHTML=str;
marqueeBox.appendChild(marqueeBox.childNodes[0]);
marqueeBox.scrollTop=0;
}
clearInterval(marqueeInterval[1]);
marqueeInterval[1]=setInterval("scrollMarquee()",20);
}
function scrollMarquee() {
marqueeBox.scrollTop++;
if(marqueeBox.scrollTop%marqueeHeight==(marqueeHeight-1)){
clearInterval(marqueeInterval[1]);
}
}
initMarquee();
</script>
　　以上已经将网站的这种滚动的做法做了一个大概的介绍。

posted @ 2006-08-24 01:02 穷鬼阅读(138) | 评论 (0) | 编辑收藏

web 打印的终极秘籍

常在WEB 打印中都需要ScriptX.cab，这里也是一样，所以原理都是一样的，这里将要详细说明的是，如何控制打印的问题。

打印的必须文件有2个：

1：配置文件：setting.js
2：显示文件：print.js

setting.js 如下：

factory.printing.header = ""
factory.printing.footer = ""
factory.printing.leftMargin = 0.75
factory.printing.topMargin = 0.75
factory.printing.rightMargin = 0.75
factory.printing.bottomMargin = 0.75

显示文件print.js 如下：

document.write('<style media="print">@media print { .noprint{display:none} } </style>');
/////////////////////////////////~~控制打印时不显示按钮的样式，在页面不需要打印的地方只需要引用该样式即可
document.write('<div id=NoPrinter name=NoPrinter align=right style="visibility:visible" class="noprint"><br> ');
document.write('<input type=button class=button value=关闭 name="bFQ" id="bFQ" onclick=\"javascript\:window.close()\">');
document.write('<input type="button" value="打印设置" onclick=\"factory.printing.PageSetup()\">');
document.write('<input type="button" value="打印预览" onclick=\"factory.printing.Preview()\">');
document.write('<input type=button name=button3 value="打印" onclick="Printers()">    </div>');

在使用打印功能时，只要把文件2个文件包含在页面中放置打印按钮的地方即可，代码如下：
<script src="../inc/print/Printer.js"></script>
<script src="../inc/print/Printers.js"></script>

posted @ 2006-08-24 01:02 穷鬼阅读(146) | 评论 (0) | 编辑收藏

网页技巧总结：快捷键提交表单方法

经常看到许多网站论坛上面快捷键提交表单的方法，比较好奇，经研究写出来了方法

JS CTRL+ENTER 提交

accesskey 提交

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>

<body>
<form action="http://www.webjx.com/index.html" method=POST name=form1>
<textarea ></textarea>
<br><input type=submit accessKey="S" value=提交(Alt+s)>
</form>

对于快捷键的使用IE：ALT+快捷键

posted @ 2006-08-24 00:52 穷鬼阅读(163) | 评论 (0) | 编辑收藏

你是否理解JavaScript的执行顺序？

通常状况下，JavaScript作为一种解释性的脚本，都是从上而下顺序执行的，但是JavaScript还允许在其语句中嵌套，也就是这个样子：

document.write("<script>alert(t);</scr"+"ipt>");

注意：</script>不能写作</script>，要用字符串连接的形式来表述，否则会有语法错误，估计是因为JavaScript遇到</script>就以为脚本结束了。

在这种情况下，正常的脚本和嵌入的脚本的执行顺序就需要研究一下了。

b.js：[下载]

alert("5");

a.js：[下载]

alert("4");
document.write("<script src=b.js></scr"+"ipt>");
alert("6");

test.html：[下载]

执行test.html，可以看到打印的顺序是：4,6,5,1,3,2,5

还可以做一些相关测试，得出的结论是：
1.同级的不同的代码块，代码块间的执行顺序为从上到下；
2.在代码中嵌入代码的情况下，先执行上层代码块，再执行子代码块；代码中嵌入代码是指一个文件引入另一个文件，而不是指所有的通过document.write形式打出的代码。

posted @ 2006-08-24 00:51 穷鬼阅读(144) | 评论 (0) | 编辑收藏

JavaScript中的高级特性及特别对象

一，编写构造函数

　　可以使用 new 运算符结合像 Object()、Date() 和 Function() 这样的预定义的构造函数来创建对象并对其初始化。面向对象的编程其强有力的特征是定义自定义构造函数以创建脚本中使用的自定义对象的能力。创建了自定义的构造函数，这样就可以创建具有已定义属性的对象。下面是自定义函数的示例（注意 this 关键字的使用）。

function Circle (xPoint, yPoint, radius) {
    this.x = xPoint; // 圆心的 x 坐标
    this.y = yPoint; // 圆心的 y 坐标
    this.r = radius; // 圆的半径
}

　　调用 Circle 构造函数时，给出圆心点的值和圆的半径（所有这些元素是完全定义一个独特的圆对象所必需的）。结束时 Circle 对象包含三个属性。下面是如何例示 Circle 对象。

var aCircle = new Circle(5, 11, 99);

　　二，使用原型来创建对象

　　在编写构造函数时，可以使用原型对象（它本身是所有构造函数的一个属性）的属性来创建继承属性和共享方法。原型属性和方法将按引用复制给类中的每个对象，因此它们都具有相同的值。可以在一个对象中更改原型属性的值，新的值将覆盖默认值，但仅在该实例中有效。属于这个类的其他对象不受此更改的影响。下面给出了使用自定义构造函数的示例，Circle（注意 this 关键字的使用）。

Circle.prototype.pi = Math.PI;
function ACirclesArea () {
return this.pi * this.r * this.r; // 计算圆面积
}
Circle.prototype.area = ACirclesArea; // 计算圆面积的函数现在是 Circle Prototype 对象的一个方法
var a = ACircle.area(); // 此为如何在 Circle 对象上调用面积函数

　　使用这个原则，可以给预定义的构造函数（都具有原型对象）定义附加属性。例如，如果想要能够删除字符串的前后空格（与 VBScript 的 Trim 函数类似），就可以给 String 原型对象创建自己的方法。

// 增加一个名为 trim 的函数作为
// String 构造函数的原型对象的一个方法。
String.prototype.trim = function() {
return this.replace(/(^\s*)|(\s*$)/g, "");   // 用正则表达式将前后空格
}
var s = "    leading and trailing spaces    "; // 有空格的字符串
window.alert(s + " (" + s.length + ")");
s = s.trim();                                  // 删除前后空格
window.alert(s + " (" + s.length + ")");

　　三，特别对象、属性和方法

　　Error 对象：保存有关错误的信息。

var newErrorObj = new Error()
var newErrorObj = new Error(
number
)
var newErrorObj = new Error(
number,
description
)

　　Error 对象的构造函数语法有以下部分：

参数：－number。与错误相联的数字值。如果省略则为零。
－description。描述错误的简短字符串。如果省略则为空字符串。

　　说明：每当产生运行时错误，就产生 Error 对象的一个实例以描述错误。该实例有两个固有属性保存错误的描述（description 属性）和错误号（number 属性）。

　　错误号是 32 位的值。高 16 位字是设备代码，而低字是实际的错误代码。

　　Error 对象也可以用如上所示的语法显式创建，或用 throw 语句抛掉。在两种情况下，都可以添加选择的任何属性，以拓展 Error 对象的能力。

　　典型地，在 try...catch 语句中创建的局部变量引用隐式创建的 Error 对象。因此，可以按选择的任何方法使用错误号和描述。

　　下面的例子演示了隐式创建 Error 对象的使用：

try {
x = y;                             // 产生错误。
} catch(e) {                         // 创建局部变量 e。
response.write(e)                  // 打印 "[object Error]".
response.write(e.number & 0xFFFF) // 打印 5009。
response.write(e.description)      // 打印 "'y' is undefined".
}

　　Function 对象：创建新的函数。

　　语法 1

function functionName([argname1 [, ...[, argnameN]]]) {
//body
}

　　语法 2

functionName = new Function( [argname1, [... argnameN,]] body );

参数：－functionName。必选项。最新创建函数的名称
－argname1...argnameN。可选项。函数接收的参数列表。
－body。可选项。包含调用该函数时被执行的 JScript 代码块的字符串。

　　说明：函数 JScript 中的基本数据类型。语法 1 创建在必要时由 JScript 转换为 Function 对象的函数值。JScript 在调用函数时将用语法 2 创建的函数转换为 Fnction 对象。

　　语法 1 是 JScript 中创建函数的基本方法。语法 2 是用于显式创建函数对象的另一方法。

　　例如，要创建将传递给它的两个参数相加的函数，可以用两种方法中的任一种完成：

　　例子 1

function add(x, y) {
return(x + y); // 执行加法并返回结果。
}

　　例子 2

var add = new Function("x", "y", "return(x+y)");

　　在两种情况下，都可以用如下代码行调用该函数：

add(2, 3);

　　注意在调用函数时，请确保包含了括号和必需的参数。调用函数时不用括号导致返回函数的文本而不是函数执行的结果。

　　Object 对象：提供所有 JScript 对象通用的功能。

obj = new Object([value])

参数：－obj。必选项。要赋值为 Object 对象的变量名。
－value。可选项。任意一种 JScript 基本数据类型。（Number、Boolean、或 String。）如果 value 为一个对象，返回不作改动的该对象。如果 value 为 null、undefined，或者没有给出，则产生没有内容的对象。

　　说明：Object 对象被包含在所有其它 JScript 对象中；在所有其它对象中它的方法和属性都是可用的。在用户定义的对象中可以重定义这些方法，并在适当的时候通过 JScript 调用。toString 方法是经常被重定义的 Object 方法的例子。

　　arguments 属性：为当前执行的 function 对象返回一个arguments 对象。

function.arguments

　　function 参数是当前执行函数的名称，可以省略。

　　说明：通过 arguments 属性，函数可以处理可变数量的参数。 arguments 对象的 length 属性包含了传递给函数的参数的数目。对于arguments 对象所包含的单个参数，其访问方法与数组中所包含的参数的访问方法相同。

　　示例：下面的例子说明了 arguments 属性的用法：

function ArgTest() {
   var i, s, numargs = arguments.length;
   s = numargs;
   if (numargs < 2)
     s += " argument was passed to ArgTest. It was ";
   else
     s += " arguments were passed to ArgTest. They were " ;
   for (i = 0; i < numargs; i++) {
     s += arguments[i] + " ";
   }
   return(s);
}

　　callee 属性：返回正被执行的 Function 对象，也就是所指定的 Function 对象的正文。

[function.]arguments.callee

　　可选项 function 参数是当前正在执行的 Function 对象的名称。

　　说明：callee 属性是 arguments 对象的一个成员，仅当相关函数正在执行时才可用。

　　callee 属性的初始值就是正被执行的 Function 对象。这允许匿名的递归函数。

　　示例：

function factorial(n) {
if (n <= 0)
return 1;
else
return n * arguments.callee(n - 1)
}
print(factorial(3));

　　要求：版本5.5或以上。

　　caller 属性：返回一个对函数的引用，该函数调用了当前函数。

functionName.caller

　　functionName 对象是所执行函数的名称。

　　说明：对于函数来说，caller 属性只有在函数执行时才有定义。如果函数是由 JScript 程序的顶层调用的，那么 caller 包含的就是 null 。

　　如果在字符串上下文中使用 caller 属性，那么结果和 functionName.toString 一样，也就是说，显示的是函数的反编译文本。

　　下面的例子说明了 caller 属性的用法：

function CallLevel() {
if (CallLevel.caller == null)
return("CallLevel was called from the top level.");
else
return("CallLevel was called by another function.");
}

　　constructor 属性：表示创建对象的函数。

object.constructor

　　必需的 object是对象或函数的名称。

　　说明：constructor 属性是所有具有 prototype 的对象的成员。它们包括除 Global 和 Math 对象以外的所有 JScript 固有对象。constructor 属性保存了对构造特定对象实例的函数的引用。

　　例如：

x = new String("Hi");
if (x.constructor == String) // 进行处理（条件为真）。
或
function MyFunc {
// 函数体。
}
y = new MyFunc;
if (y.constructor == MyFunc) // 进行处理（条件为真）。

　　description 属性：返回或设置与特定错误相联系的描述字符串。

object.description [= stringExpression]

　　description 属性的语法组成部分如下：

参数：－object。必选项。Error 对象的任意实例。
－stringExpression。可选项。包含错误描述的字符串表达式。

　　说明：description 属性包含与特定错误相联系的错误信息字符串。使用包含在这个中的值，来警告用户发生了一个不能或不想处理的错误。

　　prototype 属性：返回对象类型原型的引用。

objectName.prototype

　　objectName 参数是对象的名称。

　　说明：用 prototype 属性提供对象的类的一组基本功能。对象的新实例“继承”赋予该对象原型的操作。

　　例如，要为 Array 对象添加返回数组中最大元素值的方法。要完成这一点，声明该函数，将它加入 Array.prototype，并使用它。

function array_max( ) {
var i, max = this[0];
for (i = 1; i < this.length; i++) {
if (max < this[i])
max = this[i];
}
return max;
}
Array.prototype.max = array_max;
var x = new Array(1, 2, 3, 4, 5, 6);
var y = x.max( );

　　该代码执行后，y 保存数组 x 中的最大值，或说 6。

　　所有 JScript 固有对象都有只读的 prototype 属性。可以象该例中那样为原型添加功能，但该对象不能被赋予不同的原型。然而，用户定义的对象可以被赋给新的原型。

　　apply 方法：应用某一对象的一个方法，用另一个对象替换当前对象。

apply([thisObj[,argArray]])

参数：－thisObj。可选项。将被用作当前对象的对象。
－argArray。可选项。将被传递给该函数的参数数组。

　　说明：如果 argArray 不是一个有效的数组或者不是 arguments 对象，那么将导致一个 TypeError。

　　如果没有提供 argArray 和 thisObj 任何一个参数，那么 Global 对象将被用作 thisObj，并且无法被传递任何参数。

　　要求：版本5.5或以上。

　　call 方法：调用一个对象的一个方法，以另一个对象替换当前对象。

call([thisObj[,arg1[, arg2[, [,.argN]]]]])

参数：－thisObj。可选项。将被用作当前对象的对象。
－arg1, arg2, , argN。可选项。将被传递方法参数序列。

　　说明：call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。

　　如果没有提供 thisObj 参数，那么 Global 对象被用作 thisObj。

　　要求：版本5.5或以上。

　　concat 方法 (Array)：返回一个新数组，这个新数组是由两个或更多数组组合而成的。

array1.concat([item1[, item2[, . . . [, itemN]]]])

参数：－array1。必选项。其他所有数组要进行连接的 Array 对象。
－item1,. . ., itemN。可选项。要连接到 array1 末尾的其他项目。

　　说明：concat 方法返回一个 Array 对象，其中包含了 array1 和提供的任意其他项目的连接。

　　要加的项目（item1 … itemN）会按照从左到右的顺序添加到数组。如果某一项为数组，那么添加其内容到 array1 的末尾。如果该项目不是数组，就将其作为单个的数组元素添加到数组的末尾。

　　以下为从源数组复制元素到结果数组：

　　对于从正被连接到新数组的数组中复制的对象参数，复制后仍然指向相同的对象。不论新数组和源数组中哪一个有改变，都将引起另一个的改变。

　　对于连接到新数组的数值或字符串，只复制其值。一个数组中值有改变并不影响另一个数组中的值。

　　示例：下面这个例子说明了使用数组时 concat 方法的用法:

function ConcatArrayDemo() {
var a, b, c, d;
a = new Array(1,2,3);
b = "JScript";
c = new Array(42, "VBScript);
d = a.concat(b, c); // 返回数组 [1, 2, 3, "JScript", 42, "VBScript"]
return(d);
}

　　escape 方法：对 String 对象编码以便它们能在所有计算机上可读。

escape(charString)

　　必选项 charstring 参数是要编码的任意 String 对象或文字。

　　说明：escape 方法返回一个包含了 charstring 内容的字符串值（ Unicode 格式）。所有空格、标点、重音符号以及其他非 ASCII 字符都用 %xx 编码代替，其中 xx 等于表示该字符的十六进制数。例如，空格返回的是 "%20" 。

　　字符值大于 255 的以 %uxxxx 格式存储。

　　注意：escape 方法不能够用来对统一资源标示码 (URI) 进行编码。对其编码应使用 encodeURI 和encodeURIComponent 方法。

　　unescape 方法：解码用 escape 方法进行了编码的 String 对象。

unescape(charstring)

　　必选项 charstring 参数是要解码的 String 对象。

　　说明：unescape 方法返回一个包含 charstring 内容的字符串值。所有以 %xx 十六进制形式编码的字符都用 ASCII 字符集中等价的字符代替。

　　以 %uxxxx 格式（Unicode 字符）编码的字符用十六进制编码 xxxx 的 Unicode 字符代替。

　　注意：unescape 方法不能用于解码统一资源标识码 (URI)。解该码可使用 decodeURI 和 decodeURIComponent 方法。

　　eval 方法：检查 JScript 代码并执行。

eval(codeString)

　　必选项 codestring 参数是包含有效 JScript 代码的字符串值。这个字符串将由 JScript 分析器进行分析和执行。

　　说明：eval 函数允许 JScript 源代码的动态执行。例如,下面的代码创建了一个包含 Date 对象的新变量 mydate ：

eval("var mydate = new Date();");

　　传递给 eval 方法的代码执行时的上下文和调用 eval 方法的一样.

　　encodeURI 方法：将文本字符串编码为一个有效的统一资源标识符 (URI)。

encodeURI(URIString)

　　必选的 URIString 参数代表一个已编码的 URI。

　　说明：encodeURI 方法返回一个编码的 URI。如果您将编码结果传递给 decodeURI，那么将返回初始的字符串。encodeURI 方法不会对下列字符进行编码：":"、"/"、";" 和 "?"。请使用 encodeURIComponent 方法对这些字符进行编码。

　　要求：版本5.5或以上。

　　decodeURI 方法：返回一个已编码的统一资源标识符 (URI) 的非编码形式。

decodeURI(URIstring)

　　必要的 URIstring 参数代表一个已编码 URI 的值。

　　说明：使用 decodeURI 方法代替已经过时的 unescape 方法。

　　decodeURI 方法返回一个字符串值。

　　如果 URIString 无效，那么将产生一个 URIError。

　　要求：版本5.5或以上。

　　encodeURIComponent 方法：将文本字符串编码为一个统一资源标识符 (URI) 的一个有效组件。

encodeURIComponent(encodedURIString)

　　必选的 encodedURIString 参数代表一个已编码的 URI 组件。

　　说明：encodeURIComponent 方法返回一个已编码的 URI。如果您将编码结果传递给 decodeURIComponent，那么将返回初始的字符串。因为 encodeURIComponent 方法对所有的字符编码，请注意，如果该字符串代表一个路径，例如 /folder1/folder2/default.html，其中的斜杠也将被编码。这样一来，当该编码结果被作为请求发送到 web 服务器时将是无效的。如果字符串中包含不止一个 URI 组件，请使用 encodeURI 方法进行编码。

　　要求：版本5.5或以上。

　　decodeURIComponent 方法：返回统一资源标识符 (URI) 的一个已编码组件的非编码形式。

decodeURIComponent(encodedURIString)

　　必选的 encodedURIString 参数代表一个已编码的 URI 组件。

　　说明：URIComponent 是一个完整的 URI 的一部分。

　　如果 encodedURIString 无效，将产生一个 URIError。

　　要求：版本5.5或以上。

　　for...in 语句：对应于一个对象的每个，或一个数组的每个元素，执行一个或多个语句。

for (variable in [object | array])
statements

参数：－variable。必选项。一个变量，它可以是 object 的任一属性或 array 的任一元素。
－object, array。可选项。要在其上遍历的对象或数组。
－statement。可选项。相对于 object 的每个属性或 array 的每个元素，都要被执行的一个或多个语句。可以是复合语句。

　　说明：在循环的每次迭代前，variable 被赋予 object 的下一个属性或 array 的下一个元素。然后可以在循环内的任一语句中使用它，就好像正在使用 object 的该属性或 array 的该元素一样。

　　当在一个对象上迭代时，没有办法决定或控制把对象的成员赋给 variable 的次序。在数组内将按元素的次序执行迭代，也就是，0、1、2、......

　　示例：下面示例说明了 for ... in 语句的用法，它把一个对象用作一个联合数组：

　　join 方法：返回字符串值，其中包含了连接到一起的数组的所有元素，元素由指定的分隔符分隔开来。

arrayObj.join(separator)

参数：－arrayObj。必选项。Array 对象。
－separator。必选项。是一个 String 对象，作为最终的 String 对象中对数组元素之间的分隔符。如果省略了这个参数，那么数组元素之间就用一个逗号来分隔。

　　说明：如果数组中有元素没有定义或者为 null，将其作为空字符串处理。

　　示例：下面这个例子说明了 join 方法的用法。

function JoinDemo() {
var a, b;
a = new Array(0,1,2,3,4);
b = a.join("-");
return(b);
}

　　pop 方法：移除数组中的最后一个元素并返回该元素。

arrayObj.pop( )

　　必选的 arrayObj 引用是一个 Array 对象。

　　说明：如果该数组为空，那么将返回 undefined。

　　要求：版本5.5或以上。

　　push 方法：将新元素添加到一个数组中，并返回数组的新长度值。

arrayObj.push([item1 [item2 [. . . [itemN ]]]])

参数：－arrayObj。必选项。一个 Array 对象。
－item, item2,. . . itemN。可选项。该 Array 的新元素。

　　说明：push 方法将以新元素出现的顺序添加这些元素。如果参数之一为数组，那么该数组将作为单个元素添加到数组中。如果要合并两个或多个数组中的元素，请使用 concat 方法。

　　要求：版本5.5或以上。

　　reverse 方法：返回一个元素顺序被反转的 Array 对象。

arrayObj.reverse( )

　　必选项 arrayObj 参数为 Array 对象。

　　说明：reverse 方法将一个 Array 对象中的元素位置进行反转。在执行过程中，这个方法并不会创建一个新的 Array 对象。

　　如果数组是不连续的，reverse 方法将在数组中创建元素以便填充数组中的间隔。这样所创建的全部元素的值都是 undefined。

　　示例：下面这个例子说明了 reverse 方法的用法：

function ReverseDemo() {
var a, l;                  // 声明变量。
a = new Array(0,1,2,3,4); // 创建数组并赋值。
l = a.reverse();           // 反转数组的内容。
return(l);                 // 返回结果数组。
}

　　slice 方法 (Array)：返回一个数组的一段。

arrayObj.slice(start, [end])

参数：－arrayObj。必选项。一个 Array 对象。
－start。必选项。arrayObj 中所指定的部分的开始元素是从零开始计算的下标。
－end。可选项。arrayObj 中所指定的部分的结束元素是从零开始计算的下标。

　　说明：slice 方法返回一个 Array 对象，其中包含了 arrayObj 的指定部分。

　　slice 方法一直复制到 end 所指定的元素，但是不包括该元素。如果 start 为负，将它作为 length + start处理，此处 length 为数组的长度。如果 end 为负，就将它作为 length + end 处理，此处 length 为数组的长度。如果省略 end ，那么 slice 方法将一直复制到 arrayObj 的结尾。如果 end 出现在 start 之前，不复制任何元素到新数组中。

　　示例：在下面这个例子中，除了最后一个元素之外，myArray 中所有的元素都被复制到 newArray 中：

newArray = myArray.slice(0, -1)

　　shift 方法：移除数组中的第一个元素并返回该元素。

arrayObj.shift( )

　　必选的 arrayObj 引用是一个 Array 对象。

　　说明：shift 方法可移除数组中的第一个元素并返回该元素。

　　要求：版本5.5或以上。

　　unshift 方法：将指定的元素插入数组开始位置并返回该数组。

arrayObj.unshift([item1[, item2 [, . . . [, itemN]]]])

参数：－arrayObj。必选项。一个 Array 对象。
－item1, item2,. . .,itemN。可选项。将插入到该 Array 开始部分的元素。

　　说明：unshift 方法将这些元素插入到一个数组的开始部分，所以这些元素将以参数序列中的次序出现在数组中。

　　要求：版本5.5或以上。

　　splice 方法：从一个数组中移除一个或多个元素，如果必要，在所移除元素的位置上插入新元素，返回所移除的元素。

arrayObj.splice(start, deleteCount, [item1[, item2[, . . . [,itemN]]]])

参数：－arrayObj。必选项。一个 Array 对象。
      －start。必选项。指定从数组中移除元素的开始位置，这个位置是从 0 开始计算的。
      －deleteCount。必选项。要移除的元素的个数。
      －item1, item2,. . .,itemN。必选项。要在所移除元素的位置上插入的新元素。

　　说明：splice 方法可以移除从 start 位置开始的指定个数的元素并插入新元素，从而修改 arrayObj。返回值是一个由所移除的元素组成的新 Array 对象。

　　要求：版本5.5或以上。

posted @ 2006-08-24 00:48 穷鬼阅读(138) | 评论 (0) | 编辑收藏

document.all还是document.getElementsByName

当页面上的控件同名且多个的时候,从程序的严密角度出发,需要判断长度,而且有长度和没长度是两种引用方法.
oEle= document.all.aaa ;//这里有一个aaa的对象,但我们不知道它现在长度是多少,所以没办法对它操作.因此,我们要先做判断长度的过程.如下:
if(oEle.length){}else{};
在两种情况下,花括号里面的内容写法也是不一样的:
if(oEle.length){
for(var i = 0 ;i<oEle.length;i++){
oEle[i].value..
}
}
else{
oEle.value..
};

但是这样写是不是太复杂了点?而且当花括号里面的代码比较多的时候,我们要写两遍代码,晕了先~

还好有
document.getElementsByName()

这个方法.它对一个和多个的处理是一样的,我们可以用:
oEle = document.getElementsByName('aaa')
来引用
当oEle只有1个的时候,那么就是oEle[0],有多个的时候,用下标法oEle[i]循环获取,是不是很简单?

值得一提的是它对Name和ID的同样有效的. (它只能应用到document对象)
<div id=radiodiv language=javascript >
<INPUT name=radio1 value=1 type="radio">
<INPUT name=radio1 value=0 type="radio" CHECKED>
</div>

document.getElementsByName("radio1").item(0).value 结果是 1

但是.相对应的,还有另一个方法,可以应用的对象会更广一点:

getElementsByTagName

<div id=radiodiv language=javascript >
<INPUT name=radio1 value=1 type="radio" id=myRadio1>
<INPUT name=radio1 value=0 type="radio" id=myRadio2 CHECKED >
</div>

radiodiv.getElementsByTagName("input").item(0).value 结果是 1

,比如我知道了一个<DIV ID='aaa'><input name=input1 value=1 type=radio ><input name=input1 value=2 type=radio>......</DIV>我要取DIV里面的所有input,这样写就可以了:

aaa.getElementsByTagName('INPUT')

这样就有效的可以和别的DIV(比如说有个叫bbb的DIV,里面的也是一样的input)相区别.

同getElementsByTagName相对应,

还有一个document.body.all.tags()

能用这个方法的对象比getElementsByTagName要小得多.但比getElementsByName要多.

到这里我们还要提一下getElementById

它也是只有document对象才能使用,而且返回的是数组的第一个元素,呵呵,它的方法名都写明了是getElement而不是getElements

<div id=radiodiv language=javascript >
<INPUT name=radio1 value=1 type="radio" id=myRadio1 >
<INPUT name=radio1 value=0 type="radio" id=myRadio2 value="myVal2" CHECKED >
</div>

document.getElementById("myRadio2").value 结果是 myVal2

posted @ 2006-08-24 00:29 穷鬼阅读(206) | 评论 (0) | 编辑收藏

js版sliderBar(滑动条)控件

支持实时监控sliderbar的数据，允许有callback回调的函数，有示例

1、可自定样式SetStyle()
2、带有onSroll功能
3、有setSldPoint（设置位置)接口
4、有getSldPoint(取得位置）接口
5、可自己设置sliderBar的最大值（不是sliderbar的长度，而是值）
6、自定义微调功能（setIncrement(10))，默认为5；

代码有点乱，接口不能清晰的看出来，不好意思了，先用着吧
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> never Slider Bar </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="never-online, blueDestiny">
<META NAME="Keywords" CONTENT="javascript Slider Bar">
<META NAME="Description" CONTENT="javascript Slider Bar">
<style>
body { background-color:#fff; text-align:center; font-family:verdana; font-size:9pt; }

.sliderObj { width:350px; height:25px; background-color:#fff; border:1px solid #666666; }
.sliderBar { width:20px; background-color:#666666; border:1px solid #333; }
.sliderBtn { width:30px; background-color:#666666; color:#fff; border:1px solid #000000; }

.r-sliderObj { width:300px; height:25px; background-color:#fff; border:1px solid #CC0000; }
.r-sliderBar { width:20px; background-color:#CC0000; border:1px solid #333; }
.r-sliderBtn { width:20px; background-color:#CC0000; color:#fff; border:1px solid #000000; }

.g-sliderObj { width:300px; height:25px; background-color:#fff; border:1px solid #006600; }
.g-sliderBar { width:20px; background-color:#006600; border:1px solid #333; }
.g-sliderBtn { width:20px; background-color:#006600; color:#fff; border:1px solid #000000; }

.b-sliderObj { width:300px; height:25px; background-color:#fff; border:1px solid #003399; }
.b-sliderBar { width:20px; background-color:#003399; border:1px solid #333; }
.b-sliderBtn { width:20px; background-color:#003399; color:#fff; border:1px solid #000000; }
</style>
</HEAD>

<SCRIPT LANGUAGE="JavaScript">
<!--
/*===============================================================
//
//    Module     : never SliderBar
//    Script by : never-online, blueDestiny
//    Updated    : 2006-5-12
//    Copyright : Miracle technology all reserved
//    Website    : http://www.never-online.net
//    Email      : blueDestiny@126.com
//    Blog       : http://blog.csdn.net/blueDestiny
//    Comment    : if you using never SliderBar please hold
//                 these copyrights.
//
//    compatible : only for IE
//    History    : none
//
================================================================*/

neverSliderBar.prototype.init=function() { with(this)
{
if ($(sldID + '__BtnL') && $(sldID + '__BtnR') && $(sldID + '__Bar')) {
sldBtnL = $(sldID + '__BtnL');
sldBar = $(sldID + '__Bar');
sldBtnR = $(sldID + '__BtnR');
}
else {
sldBtnL    = document.createElement("BUTTON");
sldBtnL.id = sldID + '__BtnL';
sldBar     = document.createElement("DIV");
sldBar.id = sldID + '__Bar';
sldBtnR    = document.createElement("BUTTON");
sldBtnR.id = sldID + '__BtnR';
document.body.appendChild(sldBtnL);
document.body.appendChild(sldBar);
document.body.appendChild(sldBtnR);
}
//-------------------------------------------------------------------
sldObj           = $(sldID);
sldObj.className = objStyle;
sldBarOffset     = Offset(sldBar);
sldObjOffset     = Offset(sldObj);
//-------------------------------------------------------------------
sldBtnL.value          = "<<";
sldBtnL.className      = btnStyle;
sldBtnL.style.position = "absolute";
//-------------------------------------------------------------------
sldBtnR.value          = ">";
sldBtnR.className      = btnStyle;
sldBtnR.style.position = "absolute";
//-------------------------------------------------------------------
sldBar.className       = barStyle;
sldBar.style.position = "absolute";
sldBar.style.top       = sldObjOffset.t;
sldBar.style.height    = sldObjOffset.h;
sldBar.style.left      = sldObjOffset.l;
instance.fixed();
//-------------------------------------------------------------------
sldObj.onmousedown = function() {instance.handleObjBefore()};
sldObj.onmouseup   = function() {instance.handleObjAfter()};
//-------------------------------------------------------------------
sldBtnL.onmousedown = function() {instance.handleBtnClick('l')};
sldBtnR.onmousedown = function() {instance.handleBtnClick('r')};
sldBtnL.onfocus     = function() {this.blur()};
sldBtnR.onfocus     = function() {this.blur()};
//-------------------------------------------------------------------
sldBar.onmousedown = function() {instance.handleSldDragStart()};
sldBar.onmousemove = function() {instance.handleSldDrag()};
sldBar.onmouseup   = function() {instance.handleSldDragEnd()};
}};
neverSliderBar.prototype.fixed=function() { with(this)
{
sldBarOffset = Offset(sldBar);
sldObjOffset = Offset(sldObj);

}};
neverSliderBar.prototype.handleObjAfter=function() { with(this)
{

}};
neverSliderBar.prototype.handleBtnClick=function(direction) { with(this)
{
direction = direction.toLowerCase();
sldPoint=instance.getSldPoint();
if(direction == 'l') {
instance.setSldPoint(this.sldPoint-sldIncrement);
}
else if (direction=='r') {
instance.setSldPoint(this.sldPoint+sldIncrement);
}
else {
return alert('not valid argument ' +direction);
}
instance.applyArg();
instance.getSldPoint();
}};
neverSliderBar.prototype.handleSldDragStart=function() { with(this)
{
sldBar.setCapture();
sldMoved = true;
sldBar.onlosecapture = function(){sldMoved=false;};
sldPoint = event.clientX-sldBarOffset.l;
}};
neverSliderBar.prototype.handleSldDrag=function() { with(this)
{
if(!sldMoved) return;
var p = event.clientX-sldPoint;
if (p <= sldObjOffset.l) {
sldBar.style.left = sldObjOffset.l;
}
else if (p >= (sldObjOffset.l+sldObjOffset.w-sldBarOffset.w)) {
sldBar.style.left = sldObjOffset.l+sldObjOffset.w-sldBarOffset.w;
}
else sldBar.style.left = p;
instance.applyArg();
instance.getSldPoint();
}};
neverSliderBar.prototype.handleSldDragEnd=function() { with(this)
{
sldBar.releaseCapture();
sldMoved=false;
}};
function Offset(e) {
var t = e.offsetTop;
var l = e.offsetLeft;
var w = e.offsetWidth;
var h = e.offsetHeight;
while(e=e.offsetParent) {
t+=e.offsetTop;
l+=e.offsetLeft;
}
return { t:t, l:l, w:w, h:h }
}

var r=new neverSliderBar("s1",callback,' <b>neverSliderBar</b> ');
r.sldMax=255;
r.setBtnStyle("r-sliderBtn");
r.setBarStyle("r-sliderBar");
r.setObjStyle("r-sliderObj");
r.init();
r.setSldPoint(100);
var g=new neverSliderBar("s2",callback,' <b>neverSliderBar</b> ');
g.sldMax=255;
g.setStyle("g-sliderBar","g-sliderBtn","g-sliderObj");
g.init();
g.setSldPoint(150);
var b=new neverSliderBar("s3",callback,' <b>neverSliderBar</b> ');
b.sldMax=255;
b.setBtnStyle("b-sliderBtn");
b.setBarStyle("b-sliderBar");
b.setObjStyle("b-sliderObj");
b.setIncrement(10);
b.init();
b.setSldPoint("200");

callback(' <b>neverSliderBar</b> ');
function callback(s) {
var $=document.getElementById;
var color_r=r.getSldPoint();
var color_g=g.getSldPoint();
var color_b=b.getSldPoint();
$("color").style.backgroundColor="rgb(" +color_r+ "," +color_g+ "," +color_b+ ")";
$("d1").innerHTML=s+color_r;
$("d2").innerHTML=s+color_g;
$("d3").innerHTML=s+color_b;
}
//-->
</SCRIPT>
<p>
power by never-online, blueDestiny, http://www.QingGui.com
</p>
</BODY>
</HTML>

posted @ 2006-08-24 00:26 穷鬼阅读(468) | 评论 (0) | 编辑收藏

收集整理了一些javascript 经典函数

本人收集客户端开发经典javascript方法，希望对大家有所帮助。

1、字符串替代方法。

function String_Replace(srcString,findString,replaceString){
  return String_ReplaceB(srcString, findString, replaceString, 0);
}
function String_ReplaceB(expression, find, replacewith, start) {
  var index = expression.indexOf(find, start);
  if (index == -1)
   return expression;
  var findLen = find.length;
  var newexp = "";
  newexp = expression.substring(0, index)+(replacewith)+(expression.substring(index+findLen));
  return String_ReplaceB(newexp, find, replacewith, index+1+findLen);
}

2、取字符串长度方法

function String_GetLength(str){
  var i,rt=0;
  for(i=0;i<str.length;i++)
  {
   rt++;
   if(str.charCodeAt(i)>256)rt++;
  }
  return rt;
}

3、求浮点数方法

function getFloat(num)
{
  var num = parseFloat(num);
  if(isNaN(num))num = 0;
  return num;
}

4、求整数方法（用到浮点数取法）

function getInt(num)
{
return parseInt(getFloat(num));
}

5、判断文本域对象是否惟空

function at_checkBlank(obj,caption) {
  if(String_Replace(obj.value," ","")=="")
  {
   obj.select();
   alert(caption+"不能为空¡");
   obj.focus();
   return false;
  }
  return true;
}

6、两个Select对象(llist,rlist)互相操作

posted @ 2006-08-24 00:24 穷鬼阅读(283) | 评论 (0) | 编辑收藏

JS捕捉网页浏览器窗口的关闭与刷新

我的测试环境是2000sever ie6.0+sp4 MYIE1.31 (成功通过测试）

关闭窗口的途径常用4种：
1.双击左上角图标
2.直接双击标题栏（MYIE）
3.单击右上角关闭按钮
4.alt+f4

posted @ 2006-08-24 00:23 穷鬼阅读(267) | 评论 (0) | 编辑收藏

调用xsl来解析xml文档(js异步

1.新建一个vs2003的web工程,取名为XMLTest

2.将工程目录下的WebForm1.aspx中内容全部删除，只留下顶部的一条语句：

<%@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false" Inherits="XMLTest.WebForm1" %>

3.修改WebForm1.aspx.cs中内容，在Page_Load中加入:

    XmlDocument doc=new XmlDocument();
    String xmlfile=string.Empty;
    xmlfile=Context.Request.PhysicalApplicationPath+(Request.QueryString["sel"].ToString()=="xml"?"\\hello.xml":"\\hello.xsl");
    doc.Load(xmlfile);
    Response.Write(doc.InnerXml);

4.在工程根目录下新增test.htm,并设为工程首页:

<html>
<head>
<title></title>
</head>
<body>
<div id="resTree"></div>
<FONT face="宋体"></FONT><input type="button" value="执行" onclick="GetXml()"><BR>
<script language="JScript">
var srcTree,xsltTree,xt;
var http_request = false;

function GetXml()
{
   srcTree = new ActiveXObject("Msxml2.FreeThreadedDOMDocument");
    srcTree.async=false;
    xsltTree= new ActiveXObject("Msxml2.FreeThreadedDOMDocument");
    xsltTree.async = false;
    xt=new ActiveXObject("MSXML2.XSLTemplate");
   resTree.innerHTML="";
    makeRequest("WebForm1.aspx?sel=xml",GetXml_CB);
}

    function makeRequest(url,callback) {
        http_request = false;
        if (window.XMLHttpRequest) { // Mozilla, Safari,...
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType) {
                http_request.overrideMimeType('text/xml');
            }
        } else if (window.ActiveXObject) { // IE
            try {
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e) {}
            }
        }

        if (!http_request) {
            alert('Giving up :( Cannot create an XMLHTTP instance');
            return false;
        }
        http_request.onreadystatechange = callback;
        http_request.open('GET', url, true);
        http_request.send(null);
    }

function GetXml_CB() {

        if (http_request.readyState == 4) {
            if (http_request.status == 200) {
    srcTree.loadXML(http_request.responseText);
    makeRequest("WebForm1.aspx?sel=xsl",GetXsl_CB);
            } else {
                alert('There was a problem with the request.');
            }
        }

    }

    function GetXsl_CB(){
       if (http_request.readyState == 4) {
         if (http_request.status == 200) {
       xsltTree.loadXML(http_request.responseText);
       xt.stylesheet=xsltTree;
       var proc=xt.createProcessor();
       proc.input=srcTree;
       proc.transform();
       resTree.innerHTML=proc.output;
            } else {
                alert('There was a problem with the request.');
            }
        }

    }

</script>

</body>
</html>

5.运行工程，看看效果吧!

hello.xml(注意:我的xml文档中并没有指定对应的xsl解析文件名)

<?xml version='1.0'?>

<breakfast-menu>
<food>
    <name>Belgian Waffles</name>
    <price>$5.95</price>
    <description>Two of our famous Belgian Waffles
      with plenty of real maple syrup.</description>
    <calories>650</calories>
</food>
<food>
    <name>Strawberry Belgian Waffles</name>
    <price>$7.95</price>
    <description>Light Belgian waffles covered with
     strawberries and whipped cream.</description>
    <calories>900</calories>
</food>
<food>
    <name>Berry-Berry Belgian Waffles</name>
    <price>$8.95</price>
    <description>Light Belgian waffles covered
      with an assortment of fresh berries
      and whipped cream.</description>
    <calories>900</calories>
</food>
<food>
    <name>French Toast</name>
    <price>$4.50</price>
    <description>Thick slices made from our homemade
     sourdough bread.</description>
    <calories>600</calories>
</food>
<food>
    <name>Homestyle Breakfast</name>
    <price>$6.95</price>
    <description>Two eggs, bacon or sausage, toast,
      and our ever-popular hash browns.</description>
    <calories>950</calories>
</food>
</breakfast-menu>

hello.xsl

<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/breakfast-menu">

        <xsl:for-each select="food">
          <DIV STYLE="background-color:teal; color:white; padding:4px">
            <SPAN STYLE="font-weight:bold; color:white"><xsl:value-of select="name"/></SPAN>
            至 <xsl:value-of select="price"/>
          </DIV>
          <DIV STYLE="margin-left:20px; margin-bottom:1em; font-size:10pt">
            <xsl:value-of select="description"/>
            <SPAN STYLE="font-style:italic">
              <xsl:value-of select="calories"/> 嘿嘿
            </SPAN>
          </DIV>
        </xsl:for-each>

</xsl:template>
</xsl:stylesheet>

xml文档只有纯粹的数据，如果需要显示到html页面中的话，一般需要使用定制的xsl文档来解析，或者手工通过js来读取xml中的值显示到html中的dom树中，当使用xsl文档来解析时，相应的xml文档中必须指定对应的xsl文档才能正常显示，但当有些程序动态输出xml文档时，并没有指定相应的xsl文档，这时就必须通过其它途径来加载相应的xsl文档来解析，当然，在服务器端输出xml文档时，通过一些xml api也可以实现，我这儿描述的是通过js来实现的一种方式。用这种方式的话，就抛开了服务器平台的限制，服务器端只需要输出相应的xml文档(.net/j2ee都可以)，并且将对应的xsl文档输出给客户端（可以输出流或直接在客户端加载xsl文档)。

这里有几个需要注意的地方，我们一般是使用Msxml2.Document组件来加载xml文档的，但当动态使用xsl解析xml文档时，必须使用Msxml2.FreeThreadedDOMDocument这种自由线程的组件，同时使用MSXML2.XSLTemplate模板组件来加载xml,xsl数据，通过MSXML2.XSLTemplate的transform方法，就可以动态的用xsl来解析xml数据了,另外，IE5开始，系统默认的xml组件是msxml2，如果需要使用更新的msxml组件需要安装更新的msxml组件包，并指定新的名称，例如Msxml2.FreeThreadedDOMDocument.4.0，现在最新的msxml组件是6.0beta，可在M$网站下载。

posted @ 2006-08-24 00:16 穷鬼阅读(210) | 评论 (0) | 编辑收藏

全面理解javascript的caller,callee,call,apply概念

在提到上述的概念之前，首先想说说javascript中函数的隐含参数：arguments

Arguments

该对象代表正在执行的函数和调用它的函数的参数。

[function.]arguments[n]
参数function ：选项。当前正在执行的 Function 对象的名字。 n ：选项。要传递给 Function 对象的从0开始的参数值索引。
说明

Arguments是进行函数调用时，除了指定的参数外，还另外创建的一个隐藏对象。Arguments是一个类似数组但不是数组的对象，说它类似数组是因为其具有数组一样的访问性质及方式，可以由arguments[n]来访问对应的单个参数的值，并拥有数组长度属性length。还有就是arguments对象存储的是实际传递给函数的参数，而不局限于函数声明所定义的参数列表，而且不能显式创建 arguments 对象。arguments 对象只有函数开始时才可用。下边例子详细说明了这些性质:

//arguments 对象的用法。
function ArgTest(a, b){
   var i, s = "The ArgTest function expected ";
   var numargs = arguments.length;     // 获取被传递参数的数值。
   var expargs = ArgTest.length;       // 获取期望参数的数值。
   if (expargs < 2)
      s += expargs + " argument. ";
   else
      s += expargs + " arguments. ";
   if (numargs < 2)
      s += numargs + " was passed.";
   else
      s += numargs + " were passed.";
   s += "\n\n"
   for (i =0 ; i < numargs; i++){      // 获取参数内容。
   s += " Arg " + i + " = " + arguments[i] + "\n";
   }
   return(s);                          // 返回参数列表。
}

在此添加了一个说明arguments不是数组(Array类)的代码:

Array.prototype.selfvalue = 1;
alert(new Array().selfvalue);
function testAguments(){
alert(arguments.selfvalue);
}

运行代码你会发现第一个alert显示1，这表示数组对象拥有selfvalue属性，值为1，而当你调用函数testAguments时，你会发现显示的是“undefined”，说明了不是arguments的属性，即arguments并不是一个数组对象。

caller
返回一个对函数的引用，该函数调用了当前函数。
functionName.caller
functionName 对象是所执行函数的名称。
说明
对于函数来说，caller 属性只有在函数执行时才有定义。如果函数是由顶层调用的，那么 caller 包含的就是 null 。如果在字符串上下文中使用 caller 属性，那么结果和 functionName.toString 一样，也就是说，显示的是函数的反编译文本。
下面的例子说明了 caller 属性的用法：

// caller demo {
function callerDemo() {
    if (callerDemo.caller) {
        var a= callerDemo.caller.toString();
        alert(a);
    } else {
        alert("this is a top function");
    }
}
function handleCaller() {
    callerDemo();
}

callee

返回正被执行的 Function 对象，也就是所指定的 Function 对象的正文。

[function.]arguments.callee
可选项 function 参数是当前正在执行的 Function 对象的名称。

说明

callee 属性的初始值就是正被执行的 Function 对象。

callee 属性是 arguments 对象的一个成员，它表示对函数对象本身的引用，这有利于匿名
函数的递归或者保证函数的封装性，例如下边示例的递归计算1到n的自然数之和。而该属性
仅当相关函数正在执行时才可用。还有需要注意的是callee拥有length属性，这个属性有时候
用于验证还是比较好的。arguments.length是实参长度，arguments.callee.length是
形参长度，由此可以判断调用时形参长度是否和实参长度一致。

示例

//callee可以打印其本身
function calleeDemo() {
    alert(arguments.callee);
}
//用于验证参数
function calleeLengthDemo(arg1, arg2) {
    if (arguments.length==arguments.callee.length) {
        window.alert("验证形参和实参长度正确！");
        return;
    } else {
        alert("实参长度：" +arguments.length);
        alert("形参长度： " +arguments.callee.length);
    }
}
//递归计算
var sum = function(n){
if (n <= 0)
return 1;
else
    return n ＋arguments.callee(n - 1)
}
比较一般的递归函数：

var sum = function(n){
if (1==n) return 1;
else return n + sum (n-1);

调用时：alert(sum(100));
其中函数内部包含了对sum自身的引用，函数名仅仅是一个变量名，在函数内部调用sum即相当于调用
一个全局变量，不能很好的体现出是调用自身，这时使用callee会是一个比较好的方法。

apply and call

它们的作用都是将函数绑定到另外一个对象上去运行，两者仅在定义参数方式有所区别：

apply(thisArg,argArray);

call(thisArg[,arg1,arg2…] ]);

即所有函数内部的this指针都会被赋值为thisArg，这可实现将函数作为另外一个对象的方法运行的目的

apply的说明

如果 argArray 不是一个有效的数组或者不是 arguments 对象，那么将导致一个 TypeError。
如果没有提供 argArray 和 thisArg任何一个参数，那么 Global 对象将被用作 thisArg，
并且无法被传递任何参数。

call的说明

call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisArg指定的新对象。
如果没有提供 thisArg参数，那么 Global 对象被用作 thisArg

变态级JAVA程序员面试32问

摘要: 阅读全文

posted @ 2006-08-23 23:05 穷鬼阅读(183) | 评论 (0) | 编辑收藏

AJAX中JavaScript支持面向对象的基础

摘要: 阅读全文

posted @ 2006-08-23 00:50 穷鬼阅读(154) | 评论 (0) | 编辑收藏

已决定离开,不再改变决定

明天会怎样

setTimeout 和 setInterval 的区别

想找工作了

JavaScript中容易被误解的两个地方

缓存友好的网页

A Survey of the JavaScript Programming Language

AJAX入门之深入理解JavaScript中的函数

实用javaScript技术总结(1):屏蔽类

强制点击广告大法

JavaScript 面向对象编程, 第一部分: 继承

setTimeout 和 setInterval 的区别

用JavaScript绘图—JS2D函数集

Javascript: 关注JSVM

经典的《JavaScript 权威指南》中的“对象”不经典

JavaScript精简学习3：图像

深入研究JScript语法——常量和变量

撕页广告代码及简介

Javascript 滚动新法

web 打印的终极秘籍

网页技巧总结：快捷键提交表单方法

你是否理解JavaScript的执行顺序？

JavaScript中的高级特性及特别对象

document.all还是document.getElementsByName

js版sliderBar(滑动条)控件

收集整理了一些javascript 经典函数

JS捕捉网页浏览器窗口的关闭与刷新

调用xsl来解析xml文档(js异步

全面理解javascript的caller,callee,call,apply概念

变态级JAVA程序员面试32问

AJAX中JavaScript支持面向对象的基础

穷鬼

导航

常用链接

随笔分类

随笔档案

网站

搜索

最新评论