BlogJava-一手的小窝窝-文章分类-JAVASCRIPT

js的trim(),Ltrim(),Rtrim()函数

一手的小窝窝 — Fri, 12 Jan 2007 03:18:00 GMT

js的trim(),Ltrim(),Rtrim()函数
在Javascript中为String对象添加trim,ltrim,rtrim方法

利用Javascript中每个对象(Object)的prototype属性我们可以为Javascript中的内置对象添加我们自己的方法和属性。
以下我们就用这个属性来为String对象添加三个方法：Trim,LTrim,RTrim(作用和VbScript中的同名函数一样)
String.prototype.Trim = function()
{
    return this.replace(/(^\s*)|(\s*$)/g, "");
}
String.prototype.LTrim = function()
{
    return this.replace(/(^\s*)/g, "");
}
String.prototype.Rtrim = function()
{
    return this.replace(/(\s*$)/g, "");
}
怎么样，简单吧，下面看一个使用的实例：

一手的小窝窝 2007-01-12 11:18 发表评论

网页宽高测量

一手的小窝窝 — Fri, 15 Dec 2006 10:31:00 GMT

   < SCRIPT LANGUAGE = " JavaScript " >
    var s;
   s += " \r\n网页可见区域宽： " + document.body.clientWidth;
   s += " \r\n网页可见区域高： " + document.body.clientHeight;
   s += " \r\n网页可见区域宽： " + document.body.offsetWidth ? + " (包括边线的宽) " ;
   s += " \r\n网页可见区域高： " + document.body.offsetHeight + " (包括边线的宽) " ;
   s += " \r\n网页正文全文宽： " + document.body.scrollWidth;
   s += " \r\n网页正文全文高： " + document.body.scrollHeight;
   s += " \r\n网页被卷去的高： " + document.body.scrollTop;
   s += " \r\n网页被卷去的左： " + document.body.scrollLeft;
   s += " \r\n网页正文部分上： " + window.screenTop;
   s += " \r\n网页正文部分左： " + window.screenLeft;
   s += " \r\n屏幕分辨率的高： " + window.screen.height;
   s += " \r\n屏幕分辨率的宽： " + window.screen.width;
   s += " \r\n屏幕可用工作区高度： " + window.screen.availHeight;
   s += " \r\n屏幕可用工作区宽度： " + window.screen.availWidth;
   alert(s);
    SCRIPT >

一手的小窝窝 2006-12-15 18:31 发表评论

javascript事件查询综合

一手的小窝窝 — Fri, 15 Dec 2006 10:30:00 GMT

javascript事件查询综合

click() 对象.click() 使对象被点击。
closed 对象.closed 对象窗口是否已关闭true/false
clearTimeout(对象) 清除已设置的setTimeout对象
clearInterval(对象) 清除已设置的setInterval对象
confirm("提示信息") 弹出确认框，确定返回true取消返回false
cursor:样式更改鼠标样式 hand crosshair text wait help default auto e/s/w/n-resize

event.clientX 返回最后一次点击鼠标X坐标值；
event.clientY 返回最后一次点击鼠标Y坐标值；
event.offsetX 返回当前鼠标悬停X坐标值
event.offsetY 返回当前鼠标悬停Y坐标值

document.write(document.lastModified) 网页最后一次更新时间
document.ondblclick=x 当双击鼠标产生事件
document.onmousedown=x 单击鼠标键产生事件

document.body.scrollTop; 返回和设置当前竖向滚动条的坐标值，须与函数配合,
document.body.scrollLeft; 返回和设置当前横向滚动务的坐标值，须与函数配合，
document.title document.title="message"; 当前窗口的标题栏文字
document.bgcolor document.bgcolor="颜色值"; 改变窗口背景颜色
document.Fgcolor document.Fgcolor="颜色值"; 改变正文颜色
document.linkcolor document.linkcolor="颜色值"; 改变超联接颜色
document.alinkcolor document.alinkcolor="颜色值"; 改变正点击联接的颜色
document.VlinkColor document.VlinkColor="颜色值"; 改变已访问联接的颜色
document.forms.length 返回当前页form表单数
document.anchors.length 返回当前页锚的数量
document.links.length 返回当前页联接的数量
document.onmousedown=x 单击鼠标触发事件
document.ondblclick=x 双击鼠标触发事件
defaultStatus window.status=defaultStatus; 将状态栏设置默认显示

function function xx(){...} 定义函数
isNumeric 判断是否是数字
innerHTML xx=对象.innerHTML 输入某对象标签中的html源代码
innerText divid.innerText=xx 将以div定位以id命名的对象值设为XX

location.reload(); 使本页刷新，target可等于一个刷新的网页

Math.random() 随机涵数,只能是0到1之间的数,如果要得到其它数,可以为*10,再取整
Math.floor(number) 将对象number转为整数，舍取所有小数
Math.min(1,2) 返回1,2哪个小
Math.max(1,2) 返回1,2哪个大

navigator.appName 返回当前浏览器名称
navigator.appVersion 返回当前浏览器版本号
navigator.appCodeName 返回当前浏览器代码名字
navigator.userAgent 返回当前浏览器用户代标志

onsubmit onsubmit="return(xx())" 使用函数返回值
opener opener.document.对象控制原打开窗体对象

prompt xx=window.prompt("提示信息","预定值"); 输入语句
parent parent.框架名.对象控制框架页面

return return false 返回值
random 随机参数（0至1之间）
reset() form.reset(); 使form表单内的数据重置

split("") string.split("") 将string对象字符以逗号隔开
submit() form对象.submit() 使form对象提交数据

String对象的 charAt(x)对象反回指定对象的第多少位的字母
lastIndexOf("string") 从右到左询找指定字符，没有返回-1
indexOf("string") 从左到右询找指定字符，没有返回-1
LowerCase() 将对象全部转为小写
UpperCase() 将对象全部转为大写
substring(0,5) string.substring(x,x) 返回对象中从0到5的字符
setTimeout("function",time) 设置一个超时对象
setInterval("function",time) 设置一个超时对象

toLocaleString() x.toLocaleString() 从x时间对象中获取时间，以字符串型式存在
typeof(变量名) 检查变量的类型，值有：String,Boolean,Object,Function,Underfined

window.event.button==1/2/3 鼠标键左键等于1右键等于2两个键一起按为3
window.screen.availWidth 返回当前屏幕宽度(空白空间)
window.screen.availHeight 返回当前屏幕高度(空白空间)
window.screen.width 返回当前屏幕宽度(分辨率值)
window.screen.height 返回当前屏幕高度(分辨率值)
window.document.body.offsetHeight; 返回当前网页高度
window.document.body.offsetWidth; 返回当前网页宽度
window.resizeTo(0,0) 将窗口设置宽高
window.moveTo(0,0) 将窗口移到某位置
window.focus() 使当前窗口获得焦点
window.scroll(x,y) 窗口滚动条坐标，y控制上下移动，须与函数配合
window.open() window.open("地址","名称","属性")
属性:toolbar(工具栏),location(地址栏),directions,status(状态栏),
menubar(菜单栏),scrollbar(滚动条),resizable(改变大小), width(宽),height(高),fullscreen(全屏),scrollbars(全屏时无滚动条无参数,channelmode(宽屏),left(打开窗口x坐标),top(打开窗口y坐标)
window.location = ’view-source:’ + window.location.href 应用事件查看网页源代码;

a=new Date(); //创建a为一个新的时期对象
y=a.getYear(); //y的值为从对象a中获取年份值两位数年份
y1=a.getFullYear(); //获取全年份数四位数年份
m=a.getMonth(); //获取月份值
d=a.getDate(); //获取日期值
d1=a.getDay(); //获取当前星期值
h=a.getHours(); //获取当前小时数
m1=a.getMinutes(); //获取当前分钟数
s=a.getSeconds(); //获取当前秒钟数

对象.style.fontSize="文字大小";
单位：mm/cm/in英寸/pc帕/pt点/px象素/em文字高
1in=1.25cm
1pc=12pt
1pt=1.2px(800*600分辩率下)

文本字体属性：
fontSize大小
family字体
color颜色
fontStyle风格，取值为normal一般,italic斜体,oblique斜体且加粗
fontWeight加粗,取值为100到900不等,900最粗,light,normal,bold
letterSpacing间距,更改文字间距离,取值为,1pt,10px,1cm
textDecoration:文字修饰;取值,none不修饰,underline下划线,overline上划线
background:文字背景颜色,
backgroundImage:背景图片,取值为图片的插入路径

点击网页正文函数调用触发器：

1.onClick 当对象被点击
2.onLoad 当网页打开,只能书写在body中
3.onUnload 当网页关闭或离开时,只能书写在body中
4.onmouseover 当鼠标悬于其上时
5.onmouseout 当鼠标离开对象时
6.onmouseup 当鼠标松开
7.onmousedown 当鼠标按下键
8.onFocus 当对象获取焦点时
9.onSelect 当对象的文本被选中时
10.onChange 当对象的内容被改变
11.onBlur 当对象失去焦点
onsubmit=return(ss())表单调用时返回的值

直线 border-bottom:1x solid black
虚线 border-bottom:1x dotted black
点划线 border-bottom:2x dashed black
双线 border-bottom:5x double black
槽状 border-bottom:1x groove black
脊状 border-bottom:1x ridge black

1.边缘高光glow(color=颜色,strength=亮光大小)

Tags: javascript js 网页脚本

shunz – 周三, 2005 – 03 – 30 13:04
学习笔记
发表评论 – 更多 – 2530 reads


网页自动设置为主页
在定义了前面的javascript的cookie函数的前题下：
在后面加上

onMouseOver="if(!this.isHomePage(’http://www.mydomain.com/’)
&&
window.external && !GetCookie(’HomePage’))

{
this.setHomePage(’http://www.mydomain.com/’) ;

SetCookie(’HomePage’,’true’);
}
return
false;">
并且在前面加上

一手的小窝窝 2006-12-15 18:30 发表评论

公用的 AJAX 框架雏形

一手的小窝窝 — Sat, 02 Dec 2006 09:38:00 GMT

你完全可以认为我是抄来的，因为我就是借鉴了别人的。

// 定义 XMLHttpRequest 对象实例
var http_request = false ;

// 定义可复用的 http 请求发送函数
function send_request(method, url, content, responseType, callback) {
     // 初始化，指定处理函数，发送请求的函数
    http_request = false ;
     if (window.XMLHttpRequest) {
        http_request = new XMLHttpRequest();
         if (http_request.overrideMimeType) {
            http_request.overrideMimeType( " text/xml " );
        }
    } else {
         if (window.ActiveXObject) {
             try {
                http_request = new ActiveXObject( " Msxml2.XMLHTTP " );
            }
             catch (e) {
                 try {
                    http_request = new ActiveXObject( " Microsoft.XMLHTTP " );
                } catch (e) {
                     return false ;
                }
            }
        }
    }
     if ( ! http_request) {
        window.alert( " 创建 XMLHttpRequest实例对象错误！ " );
         return false ;
    }

     if (responseType.toLowerCase() == " text " ) {
        http_request.onreadystatechange = callback;
    } else {
         if (responseType.toLowerCase() == " xml " ) {
            http_request.onreadystatechange = callback;
        } else {
            window.alert( " 响应类别参数错误！ " );
             return false ;
        }
    }

     if (method.toLowerCase() == " get " ) {
        http_request.open(method, url, true );
    } else {
         if (method.toLowerCase() == " post " ) {
            http_request.open(method, url, true );
            http_request.setRequestHeader( " Content-Type " , " application/x-www-form-urlencoded " );
        } else {
            window.alert( " Http 请求类别参数错误。 " );
             return false ;
        }
    }

    http_request.send(content);
}

完全是柯自聪那个呵，，其它我都能背下来了。

一手的小窝窝 2006-12-02 17:38 发表评论

JavaScript 与多线程

一手的小窝窝 — Sat, 02 Dec 2006 00:11:00 GMT

1.在javascript中，可以用三种方式来模拟多线程。
a)在javascript中用command模式模拟多线程
b)window.setTimeout（code,time）
让代码在指定时间后执行一次。
c)setInterval（code,time）
让代码按照指定时间间隔来执行。

注意setTimeout与setInterval的区别

2.似乎无法在javascript的单线程执行环境中利用AutoItX来捕捉onload事件中的alert。
背景：selenium中采用了重载window.alert的方式，来截获所有javascript中的alert。
Window.alert = function (msg) {
This.Alerted.push(msg);
};
这样，所有的alert消息被悄无声息地存放在一个队列中。原本的alert弹出后，如果不点击OK或者关闭，整个javascript执行线程就一直停止。重载window.alert的方式避免弹出alert窗口，保证了selenium顺利地执行。
但是，这种方式无法捕捉body的onload事件中的alert。因为每一次刷新页面的时候，所有的被重载的方法和事件都会被清空，而我们来不及再一次重载alert方法。
使用Watir的时候，我注意到了她是借助一个名为AutoItX库来实现这个功能的。于是，设想是否可以通过同样的方法来捕捉onload事件中的alert方法。
我不详细介绍AutoItX类库，简要说一下她的原理：
var autoit = new ActiveXObject(“AutoItX3.Control”);
autoit.WinWait(title,text,…);//等待标题为title，包含text的窗口出现

开始的设想是使用如下的方法来不断查询alert窗口是否弹出：
window.setTimeout(‘fuction check() {autoit.WinExists(title,txt) == 1?return:check()’,100)
但是，却无法捕捉到alert。原因就是alert弹出后，如果不点击OK或者关闭，整个javascript执行线程就会停止。所以，调用check函数的计时也停止了。这个问题用模拟多线程是无法解决的。

对于这个问题的一个解决方案

一手的小窝窝 2006-12-02 08:11 发表评论

AJAX入门必读与实例（仿google的拖动）

一手的小窝窝 — Fri, 01 Dec 2006 13:18:00 GMT

AJAX入门必读与实例（仿google的拖动）

AJAX全称为“Asynchronous JavaScript and XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。

主要包含了以下几种技术：

Ajax（Asynchronous JavaScript + XML）的定义
基于web标准（standards-based presentation）XHTML+CSS的表示；
使用 DOM（Document Object Model）进行动态显示及交互；
使用 XML 和 XSLT 进行数据交换及相关操作；
使用 XMLHttpRequest 进行异步数据查询、检索；
使用 JavaScript 将所有的东西绑定在一起。

传统的web应用允许用户填写表单(form)，当提交表单时就向web服务器发送一个请求。服务器接收并处理传来的表单，然后返回一个新的网页。这个做法浪费了许多带宽，因为在前后两个页面中的大部分HTML代码往往是相同的。由于每次应用的交互都需要向服务器发送请求，应用的响应时间就依赖于服务器的响应时间。这导致了用户界面的响应比本地应用慢得多。

与此不同，AJAX应用可以仅向服务器发送并取回必需的数据，它使用SOAP或其它一些基于XML的web service接口，并在客户端采用JavaScript处理来自服务器的响应。因为在服务器和浏览器之间交换的数据大量减少，结果我们就能看到响应更快的应用。同时很多的处理工作可以在发出请求的客户端机器上完成，所以Web服务器的处理时间也减少了。

Ajax应用程序的优势在于：

1. 通过异步模式，提升了用户体验

2. 优化了浏览器和服务器之间的传输，减少不必要的数据往返，减少了带宽占用

3. Ajax引擎在客户端运行，承担了一部分本来由服务器承担的工作，从而减少了大用户量下的服务器负载。

**************************************************************************************************

xmlhttp的属性：

onreadystatechange 指定当readyState属性改变时的事件处理句柄，只写。
readyState 返回当前请求的状态，只读。
responseBody 将回应信息正文以unsigned byte数组形式返回，只读
responseStream 以Ado Stream对象的形式返回响应信息，只读。
responseText 将响应信息作为字符串返回，只读。
responseXML 将响应信息格式化为Xml Document对象并返回，只读。
status 返回当前请求的http状态码，只读。
statusText 返回当前请求的响应行状态，只读。

xmlhttp的方法：
abort 取消当前请求
getAllResponseHeaders 获取响应的所有http头
getResponseHeader 从响应信息中获取指定的http头
open 创建一个新的http请求，并指定此请求的方法、URL以及验证信息(用户名/密码) //常用
send 发送请求到http服务器并接收回应 //常用
setRequestHeader 单独指定请求的某个http头

语法：
onreadystatechang 指定当readyState属性改变时的事件处理句柄，只写

xmlHttpObj.onreadystatechange=a;
function a(){
if(xmlHttpObj.readyState==4){
if(xmlHttpObj.stateus==200){
alert(xmlHttpObj.responseText);
}else{
alert("加载失败！\n原因："+xmlHttpObj.stateText);
}
}
}

readyState 返回当前请求的状态，只读。

xmlHttpObj.readyState;

参见函数a;

readyState，变量。定义如下：
0 (未初始化) 对象已建立，但是尚未初始化（尚未调用open方法）
1 (初始化) 对象已建立，尚未调用send方法
2 (发送数据) send方法已调用，但是当前的状态及http头未知
3 (数据传送中) 已接收部分数据，因为响应及http头不全，这时通过responseBody和responseText获取部分数据会出现错误，
4 (完成) 数据接收完毕,此时可以通过通过responseBody和responseText获取完整的回应数据

responseText 将响应信息作为字符串返回，只读。

xmlHttpObj.responseText;

responseBody ,responseStream ,responseText ,responseXML 与之相似

responseXML可以返回一个文档树(DOM)，可以使用document.getElementsByTagName,document.getElementsByTagNameNS,document.getElementById等对其操作

stateus 返回当前请求的http状态码，只读。

xmlHttpObj.stateus;

参见函数a;

长整形标准http状态码，定义如下：
值描述
100 Continue
101 Switching protocols
200 OK
201 Created
202 Accepted
203 Non-Authoritative Information
204 No Content
205 Reset Content
206 Partial Content
300 Multiple Choices
301 Moved Permanently
302 Found
303 See Other
304 Not Modified
305 Use Proxy
307 Temporary Redirect
400 Bad Request
401 Unauthorized
402 Payment Required
403 Forbidden
404 Not Found
405 Method Not Allowed
406 Not Acceptable
407 Proxy Authentication Required
408 Request Timeout
409 Conflict
410 Gone
411 Length Required
412 Precondition Failed
413 Request Entity Too Large
414 Request-URI Too Long
415 Unsupported Media Type
416 Requested Range Not Suitable
417 Expectation Failed
500 Internal Server Error
501 Not Implemented
502 Bad Gateway
503 Service Unavailable
504 Gateway Timeout
505 HTTP Version Not Supported

statusText 返回当前请求的响应行状态

xmlHttpObj.stateText;

参考函数a;

open 创建一个新的http请求，并指定此请求的方法、URL以及验证信息

xmlHttpObj.open(Method,URL[,Async][,User][,PassWord]);
[]表示可选

参数：
Method:POST|GET(大小写不敏感)
URL:请求的URL地址，可以为绝对地址也可以为相对地址。
Async:[true|fase] 是否同步，默认为true。
User:如果服务器需要验证，此处指定用户名，如果未指定，当服务器需要验证时，则会弹出验证窗口。
Password：验证信息中的密码部分，如果用户名为空，则此值将被忽略。

send 发送请求到http服务器并接收回应

xmlHttpObj.send([Text]);

参数：
Text:要发送的数据，默认为空(null);

************************************************************************************************************
一个例子：

创建一个xmlhttp对象：现在的绝对多数浏览器都增加了对XmlHttp的支持，IE中使用ActiveXObject方式创建XmlHttp对象，其他浏览器如：Firefox、Opera、NetScape等通过window.XMLHttpRequest来创建xmlhttp对象。
var xmlhttp;
function new_xmlHttp(){
var a=null;
if(window.ActiveXObject){//IE(此处的IE泛指所有用IE内核的浏览器，下同)
a=new ActiveXObject("Msxml2.XMLHTTP");
if(!a){
a=new ActiveXObject("Microsoft.XMLHTTP")
}
}else if(window.XMLHttpRequest){//Mozilla(FireFox,NS)
a=new XMLHttpRequest()
}
return a;
}
xmlhttp=new_xmlhttp();
xmlhttp.open("GET","http://localhost/xmlfile.xml",false);//创建一个新的HTTP请求，并指定URL
xmlhttp.send();//发送
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4){
if(xmlhttp.stateus==200){
alert(xmlhttp.responseText);
}else{
alert("加载失败！\n原因："+xmlhttp.stateText);
}
}
}

一个简单完整的XMLHTTP例子：
将以下代码保存为本地HTML文件再使用

CODE:

"[url]http://www.w3.org/TR/html4/loose.dtd[/url]">

一个简单的XMLHTTP例子

xmlhttp异步的例子:
URL:

[Copy to clipboard]

例子：
仿GOOGLE个性化主页的拖动并保存定位,http://s041149.stu.cdut.edu.cn/xml/myxmltest.xml为保存相对位置的XML文件，请注意拖动前后的变化
http://s041149.stu.cdut.edu.cn/xml/（细节问题可E-MAIL:hktx[at]163[dot]com）

一手的小窝窝 2006-12-01 21:18 发表评论