首页 > 网站开发技巧参考大全

网站开发技巧参考大全

  • 事件源对象

    event.srcElement.tagName

    event.srcElement.type
  • 捕获释放

    event.srcElement.setCapture(); 

    event.srcElement.releaseCapture(); 
  • 事件按键

    event.keyCode

    event.shiftKey

    event.altKey

    event.ctrlKey
  • 事件返回值

    event.returnValue
  • 鼠标位置

    event.x

    event.y
  • 窗体活动元素

    document.activeElement
  • 绑定事件

    document.captureEvents(Event.KEYDOWN);
  • 访问窗体元素

    document.all("txt").focus();

    document.all("txt").select();
  • 窗体命令

    document.execCommand
  • 窗体COOKIE

    document.cookie
  • 菜单事件

    document.oncontextmenu
  • 创建元素

    document.createElement("SPAN"); 
  • 根据鼠标获得元素：

    document.elementFromPoint(event.x,event.y).tagName=="TD

    document.elementFromPoint(event.x,event.y).appendChild(ms) 
  • 窗体图片

    document.images[索引]
  • 窗体事件绑定

    document.οnmοusedοwn=scrollwindow;
  • 元素

    document.窗体.elements[索引]
  • 对象绑定事件

    document.all.xxx.detachEvent('onclick',a);
  • 插件数目

    navigator.plugins
  • 取变量类型

    typeof($js_libpath) == "undefined"
  • 下拉框

    下拉框.options[索引]

    下拉框.options.length
  • 查找对象

    document.getElementsByName("r1");

    document.getElementById(id);
  • 定时

    timer=setInterval('scrollwindow()',delay);

    clearInterval(timer);

  • UNCODE编码

    escape() ,unescape

  • 父对象

    obj.parentElement(dhtml)

    obj.parentNode(dom)

  • 交换表的行

    TableID.moveRow(2,1)

  • 替换CSS

    document.all.csss.href = "a.css";

  • 并排显示

    display:inline

  • 隐藏焦点

    hidefocus=true

  • 根据宽度换行

    style="word-break:break-all"

  • 自动刷新



  • 简单邮件

     
  • 快速转到位置

    obj.scrollIntoView(true)

  • 锚



    anchors

  • 网页传递参数

    location.search();

  • 可编辑

    obj.contenteditable=true
  • 执行菜单命令

    obj.execCommand

  • 双字节字符

    /[^x00-xff]/

    汉字

    /[u4e00-u9fa5]/

  • 让英文字符串超出表格宽度自动换行

    word-wrap: break-word; word-break: break-all;
  • 透明背景



  • 获得style内容

    obj.style.cssText

  • HTML标签

    document.documentElement.innerHTML

  • 第一个style标签

    document.styleSheets[0]

  • style标签里的第一个样式

    document.styleSheets[0].rules[0]

  • 防止点击空链接时，页面往往重置到页首端。

    unction()">word
  • 上一网页源

    asp:

    request.servervariables("HTTP_REFERER")

    javascript:

    document.referrer
  • 释放内存

    CollectGarbage();

  • 禁止右键

    document.oncontextmenu = function() { return false;}
  • 禁止保存

  • 禁止选取
  • onselectstart ="return false" οnselect="document.selection.empty()" οncοpy="document.selection.empty()" onbeforecopy="return false"οnmοuseup="document.selection.empty()>

  • 禁止粘贴



  • 地址栏图标



    favicon.ico 名字最好不变16*16的16色,放虚拟目录根目录下

  • 收藏栏图标

  • 查看源码

  • 关闭输入法

    isabled">
  • 自动全选

  • ENTER键可以让光标移到下一个输入框



  • 文本框的默认值

  • title换行

    obj.title = "123 sdfs "
  • 获得时间所代表的微秒

    var n1 = new Date("2004-10-10".replace(/-/g, "/")).getTime()

  • 窗口是否关闭

    win.closed
  • checkbox扁平




  • 获取选中内容

    document.selection.createRange().duplicate().text
  • 自动完成功能

    打开该功能 

    关闭该功能   
  • 窗口最大化



  • 无关闭按钮IE

    window.open("aa.htm", "meizz", "fullscreen=7");
  • 统一编码/解码

    alert(decodeURIComponent(encodeURIComponent("http://你好.com?as= hehe")))

    encodeURIComponent对":"、"/"、";" 和 "?"也编码
  • 表格行指示



    //各种尺寸
  • s  +=  " 网页可见区域宽："+  document.body.clientWidth; 

    s  +=  " 网页可见区域高："+  document.body.clientHeight; 

    s  +=  " 网页可见区域高："+  document.body.offsetWeight  +"  (包括边线的宽)"; 

    s  +=  " 网页可见区域高："+  document.body.offsetHeight  +"  (包括边线的宽)"; 

    s  +=  " 网页正文全文宽："+  document.body.scrollWidth; 

    s  +=  " 网页正文全文高："+  document.body.scrollHeight; 

    s  +=  " 网页被卷去的高："+  document.body.scrollTop; 

    s  +=  " 网页被卷去的左："+  document.body.scrollLeft; 

    s  +=  " 网页正文部分上："+  window.screenTop; 

    s  +=  " 网页正文部分左："+  window.screenLeft; 

    s  +=  " 屏幕分辨率的高："+  window.screen.height; 

    s  +=  " 屏幕分辨率的宽："+  window.screen.width; 

    s  +=  " 屏幕可用工作区高度："+  window.screen.availHeight; 

    s  +=  " 屏幕可用工作区宽度："+  window.screen.availWidth; 

//过滤数字

alse)" οnpaste="return !clipboardData.getData('text').match(/D/)" οndragenter="return false">

//特殊用途















//不缓存









//正则匹配

匹配中文字符的正则表达式： [u4e00-u9fa5]

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

匹配空行的正则表达式： [s| ]*

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

匹配首尾空格的正则表达式：(^s*)|(s*$)（像vbscript那样的trim函数）

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

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

以下是例子：

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

用正则表达式限制只能输入中文：οnkeyup="value=value.replace(/[^u4E00-u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^u4E00-u9FA5]/g,''))"

1.用正则表达式限制只能输入全角字符： οnkeyup="value=value.replace(/[^uFF00-uFFFF]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^uFF00-uFFFF]/g,''))"

2.用正则表达式限制只能输入数字：οnkeyup="value=value.replace(/[^d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^d]/g,''))"

3.用正则表达式限制只能输入数字和英文：οnkeyup="value=value.replace(/[W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^d]/g,''))"

//消除图像工具栏

 

or







//无提示关闭



function Close()

{

var ua=navigator.userAgent

var ie=navigator.appName=="Microsoft Internet Explorer"?truealse

if(ie)

{

      var IEversion=parseFloat(ua.substring(ua.indexOf("MSIE ")+5,ua.indexOf(";",ua.indexOf("MSIE "))))

  if(IEversion< 5.5)

  {

  var str  = ''

      str += '';

      document.body.insertAdjacentHTML("beforeEnd", str);

      document.all.noTipClose.Click();

  }

      else

  {

      window.opener =null;

      window.close();

      }

  }

else

{

  window.close()

  }

}

//取得控件得绝对位置(1)





//获得控件的绝对位置(2)

oRect = obj.getBoundingClientRect();

oRect.left

oRect.

//最小化,最大化,关闭

 

 

 

 

 

 

 

 

 



//光标停在文字最后





//页面进入和退出的特效



进入页面

推出页面 

这个是页面被载入和调出时的一些特效。duration表示特效的持续时间，以秒为单位。transition表示使

用哪种特效，取值为1-23:

　　0 矩形缩小 

　　1 矩形扩大 

　　2 圆形缩小

　　3 圆形扩大 

　　4 下到上刷新 

　　5 上到下刷新

　　6 左到右刷新 

　　7 右到左刷新 

　　8 竖百叶窗

　　9 横百叶窗 

　　10 错位横百叶窗 

　　11 错位竖百叶窗

　　12 点扩散 

　　13 左右到中间刷新 

　　14 中间到左右刷新

　　15 中间到上下

　　16 上下到中间 

　　17 右下到左上

　　18 右上到左下 

　　19 左上到右下 

　　20 左下到右上

　　21 横条 

　　22 竖条 

　　23 

//网页是否被检索



　　其中属性值有以下一些:

　　属性值为"all": 文件将被检索，且页上链接可被查询；

　　属性值为"none": 文件不被检索，而且不查询页上的链接；

　　属性值为"index": 文件将被检索；

　　属性值为"follow": 查询页上的链接；

　　属性值为"noindex": 文件不检索，但可被查询链接；

　　属性值为"nofollow": 



//打印分页

page1

 

page2

 



//设置打印









 










具体使用手册，更多信息，点这里



//自带的打印预览

WebBrowser.ExecWB(1,1) 打开 

Web.ExecWB(2,1) 关闭现在所有的IE窗口，并打开一个新窗口 

Web.ExecWB(4,1) 保存网页 

Web.ExecWB(6,1) 打印 

Web.ExecWB(7,1) 打印预览 

Web.ExecWB(8,1) 打印页面设置 

Web.ExecWB(10,1) 查看页面属性 

Web.ExecWB(15,1) 好像是撤销，有待确认 

Web.ExecWB(17,1) 全选 

Web.ExecWB(22,1) 刷新 

Web.ExecWB(45,1) 关闭窗体无提示 

 

856F961-340A-11D0-A96B-00C04FD705A2">   

   

 



 

 

 

 

 



//去掉打印时的页眉页脚



 

var HKEY_Root,HKEY_Path,HKEY_Key;

HKEY_Root="HKEY_CURRENT_USER";

HKEY_Path="\Software\Microsoft\Internet Explorer\PageSetup\";

//设置网页打印的页眉页脚为空

function PageSetup_Null()

{

try

{

        var Wsh=new ActiveXObject("WScript.Shell");

  HKEY_Key="header";

  Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"");

  HKEY_Key="footer";

  Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"");

}

catch(e){}

}

//设置网页打印的页眉页脚为默认值

function  PageSetup_Default()

{ 

try

{

  var Wsh=new ActiveXObject("WScript.Shell");

  HKEY_Key="header";

  Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"&w&b页码,&p/&P");

  HKEY_Key="footer";

  Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"&u&b&d");

}

catch(e){}

}







//浏览器验证



function checkBrowser()

{ 

  this.ver=navigator.appVersion 

  this.dom=document.getElementById?1:0 

  this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom)?1:0; 

  this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0; 

  this.ie4=(document.all && !this.dom)?1:0; 

  this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0; 

  this.ns4=(document.layers && !this.dom)?1:0; 

  this.mac=(this.ver.indexOf('Mac') > -1) ?1:0; 

  this.ope=(navigator.userAgent.indexOf('Opera')>-1); 

  this.ie=(this.ie6 || this.ie5 || this.ie4) 

  this.ns=(this.ns4 || this.ns5) 

  this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns5 || this.ns4 || this.mac

|| this.ope) 

  this.nbw=(!this.bw) 

  return this;

}

//计算内容宽和高

 

function  test(obj) 

{ 

      var  range  =  obj.createTextRange(); 

      alert("内容区宽度:  "  +  range.boundingWidth   

                                                +  "px 内容区高度:  "  +  range.boundingHeight  +  "px"); 

             

} 

 

 

 



//无模式的提示框

function modelessAlert(Msg)

{

  window.showModelessDialog("javascript:alert(""+escape(Msg)+"");window.close();","","status:no;resizable:no;help:no;

dialogHeight:height:30px;dialogHeight:40px;");

}



//屏蔽按键





 

 

  屏蔽鼠标右键、Ctrl+N、Shift+F10、Alt+F4、F11、F5刷新、退格键







屏蔽鼠标右键、Ctrl+N、Shift+F10、Alt+F4、F11、F5刷新、退格键





//屏蔽打印



//移动的图层，拖动



1.
οnmοusedοwn=MouseDown(this) οnmοusemοve=MouseMove() οnmοuseup=MouseUp()>meizz



2.


style="position:absolute;left=100;top=100;"

οnmοusedοwn="doMouseDown();">

wlecome





 

//文档状态改变











//刷新后不变的文本框



















//访问剪贴板

(1)拖拽访问

event.dataTransfer.setData("URL", oImage.src);

sImageURL = event.dataTransfer.getData("URL")

(2)普通访问

window.clipboardData.setData("Text",oSource.innerText);

window.clipboardData.getData("Text");

 





//操作COOKIE



function SetCookie(sName, sValue)

{

document.cookie = sName + "=" + escape(sValue) + "; ";

}

function GetCookie(sName)

{

var aCookie = document.cookie.split("; ");

for (var i=0; i < aCookie.length; i++)

{

 

  var aCrumb = aCookie.split("=");

  if (sName == aCrumb[0]) 

  return unescape(aCrumb[1]);

}

 

}

function DelCookie(sName)

{

document.cookie = sName + "=" + escape(sValue) + "; expires=Fri, 31 Dec 1999 23:59:59 GMT;";

}

//setTimeout增加参数





//自定义的apply,call

Function.prototype.apply = function (obj, argu) {

if (obj) obj.constructor.prototype._caller = this; 

var argus = new Array();

for (var i=0;i
  argus = "argu[" + i + "]";

var r;

eval("r = " + (obj ? ("obj._caller(" + argus.join(",") + ");") : ("this(" + argus.join(",") + ");")));

return r;

};

Function.prototype.call = function (obj) {

var argu = new Array();

for (var i=1;i
  argu[i-1] = arguments;

return this.apply(obj, argu);

};       



//下载文件

function DownURL(strRemoteURL,strLocalURL)

{

try

{

  var xmlHTTP=new ActiveXObject("Microsoft.XMLHTTP");

  xmlHTTP.open("Get",strRemoteURL,false);

  xmlHTTP.send();

  var adodbStream=new ActiveXObject("ADODB.Stream");

  adodbStream.Type=1;//1=adTypeBinary

  adodbStream.Open();

  adodbStream.write(xmlHTTP.responseBody);

  adodbStream.SaveToFile(strLocalURL,2);

  adodbStream.Close();

  adodbStream=null;

  xmlHTTP=null;

 

}

catch(e)

{

  window.confirm("下载URL出错!");

}

//window.confirm("下载完成.");

}



//检验连接是否有效

function getXML(URL) 

{

var xmlhttp = new ActiveXObject("microsoft.xmlhttp");

xmlhttp.Open("GET",URL, false); 

try

{ 

  xmlhttp.Send();

}

catch(e){}

finally 

{

  var result = xmlhttp.responseText;

  if(result) 

  {

  if(xmlhttp.Status==200)

  {

    return(true);

  }

  else 

  {

    return(false);

  }

  }

  else 

  {

  return(false);

  }

}

}

//POST代替FORM



//readystate是xmlhttp返回数据的进度，0=载入中,1=未初始化,2=已载入,3=运行中,4=完成

//组件是否安装

isComponentInstalled("{6B053A4B-A7EC-4D3D-4567-B8FF8A1A5739}", "componentID"))

//检查网页是否存在



function CheckURL(URL)

{

  var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

  xmlhttp.Open("GET",URL, false);

  try

  { 

    xmlhttp.Send(); 

    var result = xmlhttp.status;

  }

  catch(e) {return(false); }

  if(result==200)

  { 

    return true;

  }

  xmlhttp = null;

  return false;

}

//连接数据库





//使用数据岛







srno：


times：




 

 

   

 







20041025-01null

20041101-092004年10月1日2点22分0秒









//获得参数



search





//可编辑SELECT



             

 

更多相关：

  • cookie和url参数获取的常规实用方法合集（ES6）

    //获取某一个cookie的值 const getCookie = key => {var k = key, dc = document.cookie;if (dc.length > 0) {var s = dc.indexOf(k + "=");if (s != -1) {s = s + k.length + 1;var e = d...

  • 百度热力图

    var SGheadMapPoints = {/*obj={ maxLng: minLng: maxLat: minLat: maxCount:最大人数 minCount:最小人数 total:点位数量 }*/get: function (obj) {var arr = [];obj.maxCount || (obj.maxCount...

  • 【进大厂大数据爬虫技术核心难点】纯前端开发的爬虫程序，很多BAT技术大咖都为之惊叹

     创建index.html代码如下

    【新】欢庆网自动搜索请柬console方法，面对多种网站改版的情况

    //自动搜索指定的请柬 var alertTipText = "请柬找到了，就在这个网页里面，自己仔细看吧"; var delay = 1 * 1000;//1秒后循环下一页寻找 /*获取子DOM元素在父元素里面的索引位置（是第几个元素）*/ function getNodeListIndex(childNode) {return c...

  • json格式天气数据的获取，jsonp方式获取统计图数据

     获取天气情况（不支持跨域） /*json原生获取*/ function getJSON() {var XML;var url = "http://wthrcdn.etouch.cn/weather_mini?city=杭州";if (window.XMLHttpRequest) {XML = new XMLHttpRequest(...

  • 【汇总】ElementUI中高频次使用代码片段

     翻页器

  • JAVA中文注解驱动，解决api接口返回的json里面出现中文乱码的问题

        在src/main/resources/springmvc-servlet.xml中加入

  • Rocksdb 的 MergeOperator 简单使用记录

    本篇仅仅是一个记录 MergeOperator 的使用方式。 Rocksdb 使用MergeOperator 来代替Update 场景中的读改写操作，即用户的一个Update 操作需要调用rocksdb的 Get + Put 接口才能完成。 而这种情况下会引入一些额外的读写放大，对于支持SQL这种update 频繁的场景来说实在是不划...

  • JS数组去重精简版

    看了很多人写的好几个去重方法，我在这里精简组合下，适用于已排序与未排序的数组。 废话不多说，上代码。 数组去重