?<asp:TextBox ID=”txtTel” runat=”server” CssClass=”MustInputText” Width=”164″ AutoPostBack=”true”
??????????????? OnTextChanged=”txtTel_TextChanged” onkeydown=”check(this);” onkeyup=”check(this);” onchange=”return check(this);”></asp:TextBox>

? function check( tel ){
???????????? var e?? =?? window.event
??????????? //alert(e.keyCode);
?????????? ? if (e.keyCode == 8 ||e.keyCode ==46 || e.keyCode == 35 ||e.keyCode ==36||e.keyCode ==37||e.keyCode ==38||e.keyCode ==39||e.keyCode ==40 ){
?????????????? //避免backspace,delete,上、下、左、右、home,end不可用
??????????? }else{
??????????? tel.value = tel.value.replace(” “,””).replace(“\\”,”,”).replace(“-“,””).replace(“?”,””).replace(“(“,””).replace(“)”,””).replace(“（”,””).replace(“）”,””).replace(“、”,”,”).replace(“，”,”,”);
??????????? //alert(tel.length);
??????????? tel.focus();
??????????? if (tel.value.length>8){
??????????????? setTimeout(‘__doPostBack(\’txtTel\’,\’\’)’, 0);
??????????? }}
??????? }

1，观察对方网站的URL，看提交时是否用get方法，这样就可直接用url传参。
?2，若采用post方法，则在页面中定义和对方网站一样的变量，提交时action指向对方网站即可。
?<form name=”formQuery1″ method=”post” action=”http://www.nb315.com/CGI_EXE/BenowQuery.DLL”
??????????????????????????????????????????? enctype=”application/x-www-form-urlencoded” target=”_blank”>
???????????????? …………………………………
??????????????? </form>

利用Javascript中每个对象(Object)的prototype属性我们可以为Javascript中的内置对象添加我们自己的方法和属性。可直接调用!//自定义扩展方法，供外部调用

String.prototype.isNull = testNull;//判断是否为空
String.prototype.number = testNumber;//判断数字,只能为整数
String.prototype.doubleNumber = testDoubleNumber;//判断数字,可以为小数
String.prototype.zip = testZip;//判断邮政编码格式
String.prototype.phone = testPhoneNumber;//判断联系电话、传真格式
String.prototype.email = testEmail;//判断电子邮箱格式
//判断是否为空,为空则返回true
function testNull(){
if(this.replace(/(^\s*)|(\s*$)/g, '').length<=0)
{//为空
   return true;
}
else{//不为空
   return false;
}
}
//判断是否为数字,是数字则返回true
function testNumber()
{
if(!this.isNull()){
   for(i=0;i"9")
    {
     return false;
    }
   }
   return true;
}
else
{
   return true;
}
}
//判断邮政编码格式，格式正确返回true
function testZip()
{
if(!this.isNull()){
   if(this.length!=6)
   {
    return false;
   }
   else
   {
    var rexTel=/^[0-9]+$/;
    if(!rexTel.test(this))
    {
     return false;
    }
   }
}
return true;
}
//判断联系电话、传真格式，格式正确返回true
function testPhoneNumber()
{ 
if(!this.isNull()){
   var reg=/(^[0-9]{3,4}\-[0-9]{7,8}\-[0-9]{3,4}$)|(^[0-9]{3,4}\-[0-9]{7,8}$)|(^[0-9]{7,8}\-[0-9]{3,4}$)|(^[0-9]{7,15}$)/;
   if(!reg.test(this))
   {
    return false;
   }
   return true;
}
else
{
   return true;
}
}
//判断电子邮箱格式，格式正确返回true
function testEmail()
{
if(!this.isNull()){
   if(this.search(/^([-_A-Za-z0-9\.]+)@([_A-Za-z0-9]+\.)+[A-Za-z0-9]{2,3}$/)!=-1)
   {
    return true;
   }
   else
   {
    return false;
   }
}
else
{
   return true;
}
}
//判断是否是数字，可以为小数，格式正确返回true
function testDoubleNumber()
{
var pointCount=0;
for(var i=0;i'9')&&this.charAt(i)!='.'){
    return false;
   }
   else{
    if(this.charAt(i)=='.')pointCount++;
   }
}
if(pointCount>1){
   return false;
}else if(pointCount==1&&this.trim().length==1){
   return false;
}
return true;
}
 
//自定义扩展方法，供外部调用
String.prototype.isNull = testNull;//判断是否为空
String.prototype.number = testNumber;//判断数字,只能为整数
String.prototype.doubleNumber = testDoubleNumber;//判断数字,可以为小数
String.prototype.zip = testZip;//判断邮政编码格式
String.prototype.phone = testPhoneNumber;//判断联系电话、传真格式
String.prototype.email = testEmail;//判断电子邮箱格式
//判断是否为空,为空则返回true
function testNull(){
if(this.replace(/(^\s*)|(\s*$)/g, '').length<=0)
{//为空
   return true;
}
else{//不为空
   return false;
}
}
//判断是否为数字,是数字则返回true
function testNumber()
{
if(!this.isNull()){
   for(i=0;i"9")
    {
     return false;
    }
   }
   return true;
}
else
{
   return true;
}
}
//判断邮政编码格式，格式正确返回true
function testZip()
{
if(!this.isNull()){
   if(this.length!=6)
   {
    return false;
   }
   else
   {
    var rexTel=/^[0-9]+$/;
    if(!rexTel.test(this))
    {
     return false;
    }
   }
}
return true;
}
//判断联系电话、传真格式，格式正确返回true
function testPhoneNumber()
{ 
if(!this.isNull()){
   var reg=/(^[0-9]{3,4}\-[0-9]{7,8}\-[0-9]{3,4}$)|(^[0-9]{3,4}\-[0-9]{7,8}$)|(^[0-9]{7,8}\-[0-9]{3,4}$)|(^[0-9]{7,15}$)/;
   if(!reg.test(this))
   {
    return false;
   }
   return true;
}
else
{
   return true;
}
}
//判断电子邮箱格式，格式正确返回true
function testEmail()
{
if(!this.isNull()){
   if(this.search(/^([-_A-Za-z0-9\.]+)@([_A-Za-z0-9]+\.)+[A-Za-z0-9]{2,3}$/)!=-1)
   {
    return true;
   }
   else
   {
    return false;
   }
}
else
{
   return true;
}
}
//判断是否是数字，可以为小数，格式正确返回true
function testDoubleNumber()
{
var pointCount=0;
for(var i=0;i'9')&&this.charAt(i)!='.'){
    return false;
   }
   else{
    if(this.charAt(i)=='.')pointCount++;
   }
}
if(pointCount>1){
   return false;
}else if(pointCount==1&&this.trim().length==1){
   return false;
}
return true;
}
 

1，复制：
??? function MyCopy(ob){

?? ??? ?oTextRange=document.body.createTextRange();??
?? ???? oTextRange.moveToElementText(obj);? // TextRange 对象使其起始点之间包含指定对象内的文本。??
?? ??? ?oTextRange.select();??
?? ???? oTextRange.execCommand(“Copy”);??
??? }

2,粘贴：
function myPase(? ){
??? var obj = document.getElementById(“mytext”);
??? js=obj.createTextRange();
??? js.execCommand(“Paste”);
}

3，execCommand
execCommand(“Copy”)
text如下：
BackColor?设置或获取当前选中区的背景颜色。
Bold 切换当前选中区的粗体显示与否。
Copy 将当前选中区复制到剪贴板。
CreateBookmark 创建一个书签锚或获取当前选中区或插入点的书签锚的名称。
CreateLink?在当前选中区上插入超级链接，或显示一个对话框允许用户指定要为当前选中区插入的超级链接的?URL。?

Cut?将当前选中区复制到剪贴板并删除之。?
Delete?删除当前选中区。?
FontName?设置或获取当前选中区的字体。?
FontSize?设置或获取当前选中区的字体大小。?
ForeColor?设置或获取当前选中区的前景(文本)颜色。?
FormatBlock?设置当前块格式化标签。?
Indent?增加选中文本的缩进。?
InsertButton?用按钮控件覆盖当前选中区。?
InsertFieldset?用方框覆盖当前选中区。?
InsertHorizontalRule?用水平线覆盖当前选中区。?
InsertIFrame?用内嵌框架覆盖当前选中区。?
InsertImage?用图像覆盖当前选中区。?
InsertInputButton?用按钮控件覆盖当前选中区。?
InsertInputCheckbox?用复选框控件覆盖当前选中区。?
InsertInputFileUpload?用文件上载控件覆盖当前选中区。?
InsertInputHidden?插入隐藏控件覆盖当前选中区。?
InsertInputImage?用图像控件覆盖当前选中区。?
InsertInputPassword?用密码控件覆盖当前选中区。?
InsertInputRadio?用单选钮控件覆盖当前选中区。?
InsertInputReset?用重置控件覆盖当前选中区。?
InsertInputSubmit?用提交控件覆盖当前选中区。?
InsertInputText?用文本控件覆盖当前选中区。?
InsertMarquee?用空字幕覆盖当前选中区。?
InsertOrderedList?切换当前选中区是编号列表还是常规格式化块。?
InsertParagraph?用换行覆盖当前选中区。?
InsertSelectDropdown?用下拉框控件覆盖当前选中区。?
InsertSelectListbox?用列表框控件覆盖当前选中区。?
InsertTextArea?用多行文本输入控件覆盖当前选中区。?
InsertUnorderedList?切换当前选中区是项目符号列表还是常规格式化块。?
Italic?切换当前选中区斜体显示与否。?
JustifyCenter?将当前选中区在所在格式化块置中。?
JustifyLeft?将当前选中区所在格式化块左对齐。
JustifyRight?将当前选中区所在格式化块右对齐。
MultipleSelection?允许当用户按住?Shift?或?Ctrl?键时一次选中多于一个站点可选元素。
Outdent?减少选中区所在格式化块的缩进。?
OverWrite?切换文本状态的插入和覆盖。?
Paste?用剪贴板内容覆盖当前选中区。
Print?打开打印对话框以便用户可以打印当前页。
Refresh?刷新当前文档。?
RemoveFormat?从当前选中区中删除格式化标签。?
RemoveParaFormat?目前尚未支持。?
SaveAs?将当前?Web?页面保存为文件。?
SelectAll?选中整个文档。
UnBookmark?从当前选中区中删除全部书签。?
Underline?切换当前选中区的下划线显示与否。?
Undo?目前尚未支持。?
Unlink?从当前选中区中删除全部超级链接。?
Unselect?清除当前选中区的选中状态。

?createTextRange： 将文本转成对象

1，得到文本 text , html:htmlText

var rng=document.body.createTextRange();

alert(rng.text)

2,移动光标mg.collapse(false); true开头，false结尾

3，findText(text,-1,1))

findText(sText [, iSearchScope] [, iFlags])
在Range中查找sText
iSearchScope 开始位置，负数方向搜索
iFlags 2(整词匹配) 4(区别大小写)

4，moveStart(sUnit [, iCount])
moveEnd(sUnit [, iCount])
移动Range的开头或结尾
sUnit character(字) word(词) sentence(句) textedit(Range)
iCount 移动数量，默认为1

5，moveToPoint(iX, iY)
移动光标到坐标(iX,iY)
pasteHTML(sHTMLText)
替换Range中的html

6，select()
选中Range

?JS是大小写敏感的
如：innerText 写成 innertext将不会执行
????? innerHTML 写成 innerHtml也不会执行

?document.getElementById(“WebUrl”).innerHTML+=”<br/><input type=’text’ name=’txt”+i+”‘ id=’txt”+i+”‘ style=’width:400′ ><input type=’button’ name=’txt”+i+”‘ id=’dt”+i+”‘ value=’删除’ onclick=’DelText(this)’>”;

传id,改变其innerHTML即可。

focus(): 控件获取焦点，如在input = text中，光标出现在文字最后。
select(); 选取文本， 在input=text中，点击后文字全部选中。

?IE下，当id 为Quantity的找不到时，会找第一个name为Quantity的控件
?FireFox下，只找id
故要为控件指定id,并用getElementById得到

?JS 压缩????????? JS格式化 还原压缩后的js????????????????????? JS加密

?CSS 压缩??

CSS整形与最佳化工具

?：合并多余的css, 达到最简洁

clean css

格式化JS: http://jsbeautifier.org/

?<input type=”button” ? id = ‘ btn’ style=”display:none;”></input>

显示：document.getElementById(“btn”).style.display=”none”;

利用这样可做出折开隐藏的效果

display:

?1，调用：
? var Result? = window.showModalDialog(“test.html”,””,”dialogWidth=520px;dialogHeight=400px”);

2，在找开的模态窗口test.html中将值存到returnValue，之后会返回值给Result
?? window.returnValue = “123”;

注：table是上下等宽的表格，表示上下两行数据一致，若两行查询条件数量相差较大，不如设置两个table进行调节。

1， td 宽度：为同列宽度最大的td的宽度
?td高度：为同行高度最大的td的高度

同时，td宽度指定后，若其内的控件宽度大于td宽度，则以控件宽度为准。即td宽度以上下，内外最大的为准。
同：若td内的数据长度大于td宽度时，td宽度为数据宽度，造成变化。
案例：多个table同样的css,tr,td都一样放在一起，但就是上下格对不齐，分析了老久才知是不同的table中存的数据不一样，造成td扩展的宽度也不尽相同，呈现出来的就是不整齐的现象。

注：上述是默认情况，为改变这种td宽度为内容的宽度的情况，可设置： table-layout:fixed;
<TABLE id=”Table1″ style=”TABLE-LAYOUT:fixed” border=”1″>
table布局方式：auto 默认列宽度由单元格内容设定。 fixed：列宽由表格宽度和列宽度设定。

2，两行，若上一行有一个较宽，则根据1原则下一行相同位置的td也会很宽，可能不满足要求，此时可将上一行的较宽的td跨多个td（colspan）,此时在下
一行相同位置设置td宽度即可。即：一般下设置了上一行的宽度，下一行的就不会再设置，要设置的话也是因为上一行有colspan，要调整。

3,宽度：一般电脑都是1024*768之上的，故在设置宽度的时候，宽度要设置<=768 * 设置的百分比

<input type=’text’> 输入框长度默认为152px,故在设置td宽度的时候，为了易于控件，td的宽度至少要大于152px;

text:默认宽度为:152px;

多行text:默认宽度为：193px;

td: 默认为:12px

&nbsp;? 10px;

1，发送邮件：<a href=”mailto:someone@microsoft.com?subject=Hello%20again”>发送邮件</a> 打开本地邮件系统进行发送操作
<a href=”mailto:someone@microsoft.com?cc=someoneelse@microsoft.com&bcc=andsomeoneelse2@microsoft.com&subject=Summer%20Party&body=You%20are%20invited%20to%20a%20big%20summer%20party!”>发送邮件！</a>
注：使用 %20 来替换单词之间的空格

2，跳转到具体的位置
（1）<a href=”#C4″>查看 Chapter 4。</a>
?<a name=”C4″>Chapter 4</a>?? 定义锚点
（2）转到另一页面的某个位置
<a href=”http://www.w3school.com.cn/html_links.asp#tips“>
<a href=”#“> 利用这个可跳转到本页的开始，因为找不到这个锚点，默认转到头部
3，定义框架
（1）水平
? <frameset rows=”25%,50%,25%”>
?? <frame src=”/example/html/frame_a.html”>
?? <frame src=”/example/html/frame_b.html”>
?? <frame src=”/example/html/frame_c.html”>
</frameset>
垂直用cols
注：不能将 <body></body> 标签与 <frameset></frameset> 标签同时使用！

4，<td></td>会显示一个没有边框的单元格，为避免这种种情况，可加入空格。<td>&nbsp;</td>

5，表格带标题：caption
<table border=”6″>
<caption>我的标题</caption>
…..

6,列表
? （1） 有序：即前带数字 <ol><li>咖啡</li><li>茶</li><li>牛奶</li></ol> 可通过<ol type=”A”> 定义以字母还是数字显示顺序
? （2）无序： 即前为圆点 <ul><li>咖啡</li><li>茶</li><li>牛奶</li></ul> 可通过<ul type=”circle”>定义前显示的符号

7，div与span的区别：DIV属于区块元素，它可以作为容器嵌入其他标签，SPAN则属于线内元素。div与table一样，而span就如<b></b>一样。

8, 密码域：<input type=”password” name=”password”>

9, 设置控件外包显示，类似panel的标题
　fieldset元素用于对表单中的元素进行分组并在文档中区别标出文本。
?? legend域标题，在?fieldSet?对象绘制的方框内插入一个标题。legend元素必必位于fieldset内的第一个元素。

?<tr onclick=”alert(this.children[0].innerText)”><td>123</td><td>sdf</td></tr>

父指包含它的元素。如td的父就是tr

parentElement?获取对象层次中的父对象。?
parentNode?获取文档层次中的父对象。?
childNodes?获取作为指定对象直接后代的?HTML?元素和?TextNode?对象的集合, 返回子节点集合（包含文本节点及标签节点）
children?获取作为对象直接后代的?DHTML?对象的集合,返回子标签节点集合
previousSibling 当前节点的前一节点
nextSibling – 取得某节点的下一个同级节点

nodeName、nodeValue 以及 nodeType 包含有关于节点的信息。
nodeName 属性含有某个节点的名称。

??? * 元素节点的 nodeName 是标签名称
??? * 属性节点的 nodeName 是属性名称
??? * 文本节点的 nodeName 永远是 #text
??? * 文档节点的 nodeName 永远是 #document

注释：nodeName 所包含的 XML 元素的标签名称永远是大写的
nodeValue

对于文本节点，nodeValue 属性包含文本。

对于属性节点，nodeValue 属性包含属性值。

nodeValue 属性对于文档节点和元素节点是不可用的。
nodeType

nodeType 属性可返回节点的类型。

最重要的节点类型是：
元素类型 ??? 节点类型
元素element ??? 1
属性attr ??? 2
文本text ??? 3
注释comments ??? 8
文档document ??? 9

var s = document.getElementById(“txtUserName”);
alert ( s.value ); alert(s.id);
直接操作。
onclick = “this.style.backgroundColor=’#FF0000′

1，鼠标事件

• 事件按键 event.keyCode event.shiftKey event.altKey event.ctrlKey??? （event可直接用，如document一样）
• ?如： document.onkeydown=function () {alert(event.keyCode );}
• 鼠标位置 event.x event.y?????????????????? 注：FF下时，event只能在事件发生的现场使用，在调用函数时传入event对象
  
• 根据鼠标获得元素：
• ? document.elementFromPoint(event.x,event.y).tagName==”TD
• ? document.elementFromPoint(event.x,event.y).appendChild(ms)??
• 交换表的行 TableID.moveRow(2,1)
• 获取选中内容 document.selection.createRange().duplicate().text

事件如delphi一样，可执行点击按键操作

?一、数据类型
?? 在js只有五种数据类型，null, undefined, String, Number,Object

????? undefined：未定义，我们也可称之为不存在，typeof(undefined)=undefined.

　　null:为空。undefined是不存在，而null是存在，但却无。typeof(null)=object,但null又不是object，且undefined==null

　　boolean:true or false。

　　Number: 数字如：var s= new Number(20);??? alert(s.toString(2)); //10100? 接收时不是用Number a = new Number(20),而是用var 这样s就是一个Number类型，其属性有：MAX_VALUE 可表示的最大的数。MIN_VALUE 可表示的最小的数。 NaN 非数字值。NEGATIVE_INFINITY 负无穷大，溢出时返回该值。POSITIVE_INFINITY 正无穷大，溢出时返回该值。 方法有：toString? 可以接受一个从2到36的数字，然后把我们的Number转换为相应的进制数。

????? 注：NaN和Infinity是两个特殊之数，NaN代表一个无法用数值来表示的数字，而Infinity代表一个无穷大的数字，相对的，-Infinify则代表负无穷大。在此有两点特殊的地方：NaN!=NaN，Infinity/Infinity=NaN。

　　String：字符串，Javascript中没有字符的概念，字符串是表示文本的最小单位。在字符串中，有这样的两个函数，分别是charAt(index)和charCodeAt(index)分别返回对应索引的字符和字符Unicode编码。在我们平时，可能经常会使用下标的方式访问，如s[10]，可是这并不是ECMAScript的标准，应该尽量避免。

二，js建立类对象

?1，成员变量权限分为私有与公有。私有指用var建立的成员 ，公有指用this建立的对象???

var obj = function () {??? var a = 1;??? this.b = 2;??? this.c = 5;??? this.fun = function () {? ?? this.c = a+this.b;??? }};
var o = new obj(); o.fun();????????? alert(o.b);?? //2 ???????? alert(o.a);? //不可访问结果为undefined

2,为类动态增加变量，函数—prototype

??? var obj = function () {? this.c = 5;};
var o = new obj(); alert(o.c);? //5
obj.prototype.tt = -3? obj.prototype.setValue = function(){?? this.c = -1; } //可直接操作类成员
o.setValue(); //设置后直接调用

alert(o.c);
alert(o.tt);

利用prototype有个好处，定义的东西多个实例也是共用一个。不然直接定义方法，则每一个实例的方法是不一样的，存在不同的地址中

1，数据转换

• 转换为字符型：String();?例：String(678)的结果为“678”??
• 2.转换为数值型：Number();?例：Number(“678”)的结果为678??
• 3.转换为布尔型：Boolean();?例：Boolean(“aaa”)的结果为true

2, 一个值中提取另一种类型的值

• 提取字符串中的整数：parseInt();?例：parseInt(“123zhang”)的结果为123
  
• 提取字符串中的浮点数：parseFloat();?例：parseFloat(“0.55zhang”)的结果为0.55?
  

3, 运行字符串指定的函数 – EVAL

1. 执行用字符串表示的一段javascript代码：eval();?例：zhang=eval(“1+1”)的结果zhang=2?
   

4, 变量指定可指定为方法， //js方法形参不用var 直接指定一个名字即可如：function doit( username ){}
?var?myfunc?=?function?()
????????{
????????????alert(“hello“);
????????};
?js没有类，但可用{} 来创建，并可指定方法。如： var s = {}; ? s.info = myfunc;??????????? s.info();JavaScript里的代码如方法等也是一种数据，同样可以被任意赋值和修改!var speaker = {text: “Hello World”, say: function(){alert(this.text)}};? 用{} 创建了一个对象，拥有text属性与say方法。
注：没有对象实例的概念，对象即是实例。
对象创建采用的是json方法。 JavaScript Object Notation(缩写JSON)的形式，翻译为中文就是“JavaScript对象表示法”。

或者用：var car = new Object(); car.colur = ‘red’;

5, js 创建对象的方法

6, 查看网页源代码
. <input type=button value=”/查看网页源代码
onclick=”window.location = “view-source:”+ “http://www.pconline.com.cn“”>???????????? //view-source:www.baidu.com

7,让页面可编辑：
document.body.contentEditable=’true’;document.designMode=’on’;

8,ENTER键可以让光标移到下一个输入框
<input onkeydown=”if(event.keyCode==13)event.keyCode=9″>
9, 事件执行后执行另一个事件
<ice:inputText onkeydown=”return testKey(event)” id=”proff” style=”width: 81px” value=”#{Logon.imageValue}” />

<script language=”javascript”>
function testKey(event){
if(event.keyCode==13){
document.getElementById(“logon:logonButton”).click();
return false;
}
}
</script>

10, <noscript> 标签用于定义假如脚本没有执行时的替代文本。这个标签被用于以下情况：如果浏览器能够识别 <script> 标签，但是不支持其中的脚本，那么这些浏览器将显示出 <noscript> 标签内部的文本。不过，如果浏览器支持 <script> 内的脚本，那么浏览器将忽略 <noscript> 标签。