JAVASCRIPT精彩200例(五)

169.动态修改CSS的另一种方式
this.runtimeStyle.cssText = "color:#990000;border:1px solid #cccccc";//


170.正则表达式
匹配中文字符的正则表达式: [/u4e00-/u9fa5]

匹配双字节字符(包括汉字在内)[^/x00-/xff]

应用:计算字符串的长度(一个双字节字符长度计2,ASCII字符计1)

String.prototype.len=function(){return this.replace([^/x00-/xff]/g,"aa").length;}

匹配空行的正则表达式:/n[/s| ]*/r

匹配HTML标记的正则表达式:/<(.*)>.*<///1>|<(.*) //>/

匹配首尾空格的正则表达式:(^/s*)|(/s*$)

应用:javascript中没有像vbscript那样的trim函数,我们就可以利用这个表达式来实现,如下:

String.prototype.trim = function()
{
    return this.replace(/(^/s*)|(/s*$)/g, "");
}

////////利用正则表达式分解和转换IP地址:


下面是利用正则表达式匹配IP地址,并将IP地址转换成对应数值的Javascript程序:

function IP2V(ip)
{
 re=/(/d+)/.(/d+)/.(/d+)/.(/d+)/g //匹配IP地址的正则表达式

if(re.test(ip))
{
return RegExp.$1*Math.pow(255,3))+RegExp.$2*Math.pow(255,2))+RegExp.$3*255+RegExp.$4*1
}
else
{
 throw new Error("Not a valid IP address!")
}
}

不过上面的程序如果不用正则表达式,而直接用split函数来分解可能更简单,程序如下:

var ip="10.100.20.168"
ip=ip.split(".")
alert("IP值是:"+(ip[0]*255*255*255+ip[1]*255*255+ip[2]*255+ip[3]*1))

匹配Email地址的正则表达式:/w+([-+.]/w+)*@/w+([-.]/w+)*/./w+([-.]/w+)*

匹配网址URL的正则表达式:http://([/w-]+/.)+[/w-]+(/[/w- ./?%&=]*)?


//////////利用正则表达式去除字串中重复的字符的算法程序:


var s="abacabefgeeii"
var s1=s.replace(/(.).*/1/g,"$1")
var re=new RegExp("["+s1+"]","g")
var s2=s.replace(re,"")
alert(s1+s2) //结果为:abcefgi


思路是使用后向引用取出包括重复的字符,再以重复的字符建立第二个表达式,取到不重复的字符,两者串连。这个方

法对于字符顺序有要求的字符串可能不适用。

//////////得用正则表达式从URL地址中提取文件名的javascript程序,如下结果为page1


s="http://www.9499.net/page1.htm"
s=s.replace(/(.*//){0,}([^/.]+).*/ig,"$2")
alert(s)

/////////利用正则表达式限制网页表单里的文本框输入内容:


用正则表达式限制只能输入中文:onkeyup="value=value.replace(/[^/u4E00-/u9FA5]/g,'')"

onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/u4E00-/u9FA5]/g,'')

)"


用正则表达式限制只能输入全角字符: onkeyup="value=value.replace(/[^/uFF00-/uFFFF]/g,'')"

onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/uFF00-/uFFFF]/g,'')

)"


用正则表达式限制只能输入数字:onkeyup="value=value.replace(/[^/d]/g,'')

"
onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))"

用正则表达式限制只能输入数字和英文:onkeyup="value=value.replace(/[/W]/g,'')

"
onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))"


171.设置和使用cookie
<HTML>
<BODY>
设置与读取 cookies...<BR>
写入cookie的值<input type=text name=gg>
<INPUT TYPE = BUTTON Value = "设置cookie" onClick = "Set()">
<INPUT TYPE = BUTTON Value = "读取cookie" onClick = "Get()"><BR>
<INPUT TYPE = TEXT NAME = Textbox>
</BODY>
<SCRIPT LANGUAGE="JavaScript">
function Set()
{
var Then = new Date()
Then.setTime(Then.getTime() + 60*1000 ) //60秒

document.cookie = "Cookie1="+gg.value+";expires="+ Then.toGMTString()
}

function Get()
{
 var cookieString = new String(document.cookie)
 var cookieHeader = "Cookie1="
 var beginPosition = cookieString.indexOf(cookieHeader)
 if (beginPosition != -1)
 {
  document.all.Textbox.value = cookieString.substring(beginPosition + cookieHeader.length)
 }
 else
  document.all.Textbox.value = "Cookie 未找到!"
}
</SCRIPT>
</HTML>//



172.取月的最后一天
function getLastDay(year,month)
{
 //取年

 var new_year = year;
 //取到下一个月的第一天,注意这里传入的month是从1~12

 var new_month = month++;
 //如果当前是12月,则转至下一年

 if(month>12)
 {
  new_month -=12;
  new_year++;
 }
 var new_date = new Date(new_year,new_month,1);
 return (new Date(new_date.getTime()-1000*60*60*24)).getDate();
}//


173.判断当前的焦点是组中的哪一个
for(var i=0;i<3;i++)
 if(event.srcElement==bb[i])
  break;//


 

174.实现类
package com.baosight.view.utils;
import javax.servlet.jsp.tagext.TagSupport;
import javax.servlet.http.HttpSession;
public class Mytag extends TagSupport
{
  public int doStartTag() throws javax.servlet.jsp.JspException
  {
    boolean canAccess = false;
    HttpSession session= pageContext.getSession();
    if (canAccess)
    {
      return EVAL_BODY_INCLUDE;
    }
    else
    {
      return this.SKIP_BODY;
    }
  }
}

175.在web.xml中添加定义
  <taglib>
    <taglib-uri>guoguo</taglib-uri>
    <taglib-location>/WEB-INF/abc.tld</taglib-location>
  </taglib>


176.标签库中定义abc.tld
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE taglib PUBLIC "-//Sun Microsystems, Inc.//DTD JSP Tag Library 1.1//EN"
"http://java.sun.com/j2ee/dtds/web-jsptaglibrary_1_1.dtd">
<taglib>
 <tlibversion>1.0</tlibversion>
 <jspversion>1.1</jspversion>
 <shortname>hr</shortname>
 <uri>guoguo</uri>
 <info>Extra 3 Tag Library</info>
 <tag>
  <name>mytag</name>
  <tagclass>com.baosight.view.utils.Mytag</tagclass>
  <attribute>
   <name>id2</name>
   <required>true</required>
            <rtexprvalue>true</rtexprvalue>
  </attribute>
 </tag>
</taglib>


177.在使用自定义标签的页面中加入自己定义的标签,
<%@ taglib uri="guoguo" prefix="guoguo" %>
//自己定义标签



178.显示带边框的集
<fieldset style="border:1px gray solid;width:100px">
  <legend>查询条件</legend>
dfdfdf
</fieldset>//



179.【文件(F)】菜单中的命令的实现

1、〖打开〗命令的实现
[格式]:document.execCommand("open")
[说明]这跟VB等编程设计中的webbrowser控件中的命令有些相似,大家也可依此琢磨琢磨。
[举例]<body></body>之间加入:
<a href="###" onclick=document.execCommand("open")>打开</a>

2、〖使用 记事本 编辑〗命令的实现
[格式]:location.replace("view-source:"+location)
[说明]打开记事本,在记事本中显示该网页的源代码。
[举例]<body></body>之间加入:
<a href="###" onclick=location.replace("view-source:"+location)>使用 记事本编辑</a>

3、〖另存为〗命令的实现
[格式]:document.execCommand("saveAs")
[说明]将该网页保存到本地盘的其它目录!
[举例]<body></body>之间加入:
<a href="###" onclick=document.execCommand("saveAs")>另存为</a>

4、〖打印〗命令的实现
[格式]:document.execCommand("print")
[说明]当然,你必须装了打印机!
[举例]<body></body>之间加入:
<a href="###" onclick=document.execCommand("print")>打印</a>

5、〖关闭〗命令的实现
[格式]:window.close();return false
[说明]将关闭本窗口。
[举例]<body></body>之间加入:
<a href="###" onclick=window.close();return false)>关闭本窗口</a>

180.【编辑(E)】菜单中的命令的实现

〖全选〗命令的实现
[格式]:document.execCommand("selectAll")
[说明]将选种网页中的全部内容!
[举例]<body></body>之间加入:
<a href="###" onclick=document.execCommand("selectAll")>全选</a>

181.【查看(V)】菜单中的命令的实现

1、〖刷新〗命令的实现
[格式]:location.reload()history.go(0)
[说明]浏览器重新打开本页。
[举例]<body></body>之间加入:
<a href="###" onclick=location.reload()>刷新</a>
或加入:
<a href="###" onclick=history.go(0)>刷新</a>

2、〖源文件〗命令的实现
[格式]:location.replace("view-source:"+location)
[说明]查看该网页的源代码。
[举例]<body></body>之间加入:
<a href="###" onclick=location.replace("view-source:"+location)>查看源文件</a>

3、〖全屏显示〗命令的实现
[格式]:window.open(document.location, "url", "fullscreen")
[说明]全屏显示本页。
[举例]<body></body>之间加入:
<a href="###" onclick=window.open(document.location,"url","fullscreen")>全屏显示</a>

182.【收藏(A)】菜单中的命令的实现

1、〖添加到收藏夹〗命令的实现
[格式]:window.external.AddFavorite('url', '“网站名”)
[说明]将本页添加到收藏夹。
[举例]在<body></body>之间加入:
<a href="javascript:window.external.AddFavorite('
http://oh.jilinfarm.com', '胡明新的个人主页')">添加到收


藏夹</a>

2、〖整理收藏夹〗命令的实现
[格式]:window.external.showBrowserUI("OrganizeFavorites",null)
[说明]打开整理收藏夹对话框。
[举例]<body></body>之间加入:
<a href="###" onclick=window.external.showBrowserUI("OrganizeFavorites",null)>整理收藏夹</a>

183.【工具(T)】菜单中的命令的实现

〖internet选项〗命令的实现
[格式]:window.external.showBrowserUI("PrivacySettings",null)
[说明]打开internet选项对话框。
[举例]<body></body>之间加入:
<a href="###" onclick=window.external.showBrowserUI("PrivacySettings",null)>internet选项</a>

184.【工具栏】中的命令的实现

1、〖前进〗命令的实现
[格式]history.go(1)history.forward()
[说明]浏览器打开后一个页面。
[举例]<body></body>之间加入:
<a href="###" onclick=history.go(1)>前进</a>
或加入:
<a href="###" onclick=history.forward()>前进</a>

2、〖后退〗命令的实现
[格式]:history.go(-1)history.back()
[说明]浏览器返回上一个已浏览的页面。
[举例]<body></body>之间加入:
<a href="###" onclick=history.go(-1)>后退</a>
或加入:
<a href="###" onclick=history.back()>后退</a>

3、〖刷新〗命令的实现
[格式]:document.reload()history.go(0)
[说明]浏览器重新打开本页。
[举例]<body></body>之间加入:
<a href="###" onclick=location.reload()>刷新</a>
或加入:
<a href="###" onclick=history.go(0)>刷新</a>

185.其它命令的实现
〖定时关闭本窗口〗命令的实现
[格式]:settimeout(window.close(),关闭的时间)
[说明]将关闭本窗口。
[举例]<body></body>之间加入:
<a href="###" onclick=settimeout(window.close(),3000)>3秒关闭本窗口</a>


【附】为了方便读者,下面将列出所有实例代码,你可以把它们放到一个html文件中,然后预览效果。
<a href="###" onclick=document.execCommand("open")>打开</a><br>
<a href="###" onclick=location.replace("view-source:"+location)>使用 记事本编辑</a><br>
<a href="###" onclick=document.execCommand("saveAs")>另存为</a><br>
<a href="###" onclick=document.execCommand("print")>打印</a><br>
<a href="###" onclick=window.close();return false)>关闭本窗口</a><br>
<a href="###" onclick=document.execCommand("selectAll")>全选</a><br>
<a href="###" onclick=location.reload()>刷新</a> <a href="###" onclick=history.go(0)>刷新</a><br>
<a href="###" onclick=location.replace("view-source:"+location)>查看源文件</a><br>
<a href="###" onclick=window.open(document.location,"url","fullscreen")>全屏显示</a><br>
<a href="javascript:window.external.AddFavorite('http://homepage.yesky.com', '天极网页陶吧')">添加到收藏

</a><br>
<a href="###" onclick=window.external.showBrowserUI("OrganizeFavorites",null)>整理收藏夹</a><br>
<a href="###" onclick=window.external.showBrowserUI("PrivacySettings",null)>internet选项</a><br>
<a href="###" onclick=history.go(1)>前进1</a> <a href="###" onclick=history.forward()>前进2</a><br>
<a href="###" onclick=history.go(-1)>后退1</a> <a href="###" onclick=history.back()>后退2</a><br>
<a href="###" onclick=settimeout(window.close(),3000)>3秒关闭本窗口</a><br>


186.给DHTML中的标签添加一个新的属性,可以随意加
<BODY onload="alert(a1.epass)">
<input type=text name="a1" epass="zhongguo">
</BODY>//



187.xmlhttp技术
<BODY> 此方法是通过XMLHTTP对象从服务器获取XML文档,示例如下。
 <input type=button value="加载XML文档" onclick="getData('data.xml')" >
 <script language="JavaScript" >
 function getDatal(url){
 var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");//创建XMLHTTPRequest对象

 xmlhttp.open("GET",url,false,"","");//使用HTTP GET初始化HTTP请求

 xmlhttp.send("");//发送HTTP请求并获取HTTP响应

 return xmlhttp.responseXML;//获取XML文档

 }
 </script >
</BODY>//


188.服务器端通过request.getReader()获得传入的字符串

189.在java中使用正则表达式
java.util.regex.Pattern p =

java.util.regex.Pattern.compile("file://d+|.//d+|//d+.//d*|(E|//d+E|.//d+E|//d+.//d*E)((//+|-)//d|//d)//d*");
java.util.regex.Matcher m = p.matcher("12.E+3");
boolean result = m.matches();//



190.给下拉框分组
<SELECT>
<OPTGROUP LABEL="碱性金属">
<OPTION>(Li)</OPTION>
<OPTION>(Na)</OPTION>
<OPTION>(K)</OPTION>
</OPTGROUP>
<OPTGROUP LABEL="卤素">
<OPTION>(F)</OPTION>
<OPTION>(Cl)</OPTION>
<OPTION>(Br)</OPTION>
</OPTGROUP>
</SELECT>//


191.加注音
<RUBY>
基准文本
<RT>注音文本
</RUBY>//



192.加删除线
<S>此文本将带删除线显示。</S>//


193.取frame中的event事件
document.frames("workspace").event.keyCode//


194.是弹出方法的定义
String.prototype.trim=function()
{
 return this.replace(/(^/s*)|(/s*$)/g, "");
}
alert(" ".trim)//

 

195.防止网页被包含
if (window != window.top)
top.location.href = location.href;//



196.让网页一直在frame里面
if(window==window.top)
{
 document.body.innerHTML="<center><h1>请通过正常方式访问本页面!</h1></center>";
 //window.close();

}//


 

你可能感兴趣的:(JAVASCRIPT精彩200例(五))