zoukankan      html  css  js  c++  java
  • Web中常用的Javascript技巧(1)

    < DOCTYPE html PUBLIC -WCDTD XHTML StrictEN httpwwwworgTRxhtmlDTDxhtml-strictdtd>
    事件源对象 


    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.onmousedown=scrollwindow; 


    元素 


    document.窗体.elements[索引]

     

    对象绑定事件 


    插件数目

     
    navigator.plugins 


    取变量类型

     
    typeof($js_libpath) == "undefined" 


    下拉框

     
    下拉框.options[索引] 
    下拉框.options.length 


    查找对象 


    document.getElementsByName("r1"); 
    document.getElementByIdx(id); 



    定时 


    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"

     
    自动刷新 


    <meta HTTP-EQUIV="***" CONTENT="8;URL=http://c98.yeah.net">

     
    简单邮件

     
    <a href="mailto:aaa@bbb.com?subject=ccc&body=xxxyyy"> 


    快速转到位置 


    obj.scrollIntoView(true)

     


     
    <a name="first"> 
    <a href="#first">anchors</a> 


    网页传递参数

     
    location.search();


    可编辑

     
    obj.contenteditable=true 


    执行菜单命令

     
    obj.execCommand 


    双字节字符 


    /[^\x00-\xff]/ 


    汉字 


    /[\u4e00-\u9fa5]/ 


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

     
    word-wrap: break-word; word-break: break-all; 


    透明背景

     
    <IFRAME src="http://www.blog.com.cn/1.htm" width=300 height=180 allowtransparency></iframe> 


    获得style内容

     
    obj.style.cssText 


    HTML标签

     
    document.documentElement.innerHTML 


    第一个style标签

     
    document.styleSheets[0] 


    style标签里的第一个样式

     
    document.styleSheets[0].rules[0] 


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

     
    <a href="javascript:function()">word</a> 


    上一网页源

     
    asp: 
    request.servervariables("HTTP_REFERER") 
    javascript: 
    document.referrer 


    释放内存

     
    CollectGarbage();


    禁止右键 


    document.oncontextmenu = function() { return false;} 


    禁止保存 


    <noscript><iframe src="http://www.blog.com.cn/*.htm"></iframe></noscript>


    禁止选取


    <body oncontextmenu="return false" ondragstart="return false" onselectstart ="return false" onselect="document.selection.empty()" oncopy="document.selection.empty()" onbeforecopy="return false"onmouseup="document.selection.empty()> 


    禁止粘贴

     
    <input type=text onpaste="return false"> 


    地址栏图标 


    <link rel="Shortcut Icon" href="favicon.ico">

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

    <link rel="Bookmark" href="favicon.ico"> 



    查看源码


    关闭输入法

     
    <input style="ime-mode:disabled"> 


    自动全选

     
    <input type=text name=text1 value="http://www.blog.com.cn/123" onfocus="this.select()"> 


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

     
    <input onkeydown="if(event.keyCode==13)event.keyCode=9">


    文本框的默认值

     
    <input type=text value="http://www.blog.com.cn/123" onfocus="alert(this.defaultValue)"> 


    title换行

     
    obj.title = "123&#13sdfs&#32" 


    获得时间所代表的微秒 


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


    窗口是否关闭 


    win.closed 


    checkbox扁平

     
    <input type=checkbox style="position: absolute; clip:rect(5px 15px 15px 5px)"> 


    获取选中内容 


    document.selection.createRange().duplicate().text


    自动完成功能

     
    <input  type=text  autocomplete=on>打开该功能  
    <input  type=text  autocomplete=off>关闭该功能 


    窗口最大化 


    <body onload="window.resizeTo(window.screen.width - 4,window.screen.height-50);window.moveTo(-4,-4)"> 


    无关闭按钮IE

     
    window.open("aa.htm", "meizz", "fullscreen=7"); 


    统一编码/解码

     
    alert(decodeURIComponent(encodeURIComponent("http://你好.com?as= hehe"))) 
    encodeURIComponent对":"、"/"、";" 和 "?"也编码 



    表格行指示


    //各种尺寸 


    s  +=  "\r\n网页可见区域宽:"+  document.body.clientWidth;   
    s  +=  "\r\n网页可见区域高:"+  document.body.clientHeight;   
    s  +=  "\r\n网页可见区域高:"+  document.body.offsetWeight  +"  (包括边线的宽)";   
    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; 
    //不缓存 


    <META HTTP-EQUIV="pragma" CONTENT="no-cache"> 
    <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate"> 
    <META HTTP-EQUIV="expires" CONTENT="0"> 


    //正则匹配 


    匹配中文字符的正则表达式: [\u4e00-\u9fa5] 
    匹配双字节字符(包括汉字在内):[^\x00-\xff] 
    匹配空行的正则表达式:\n[\s| ]*\r 
    匹配HTML标记的正则表达式:/<(.*)>.*<\/\1>|<(.*) \/>/  
    匹配首尾空格的正则表达式:(^\s*)|(\s*$)(像vbscript那样的trim函数) 
    匹配Email地址的正则表达式:\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)* 
    匹配网址URL的正则表达式:http://([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)? 


    以下是例子: 
  • 相关阅读:
    学业优秀者汇总
    计算机类教学质量国家标准(含信息安全专业)
    从《构建之法》到《终身幼儿园》
    2019-2020-1 《信息安全专业导论》教学进程
    程序设计快速入门
    铜齿铁牙UP计划
    ios app 提交评审注意事项
    IOS开发之不同版本适配问题2(#ifdef __IPHONE_7_0)
    iOS:个性化UITextView(缩进,行距,铺满)
    iOS 同一设备内的应用之间资源共享的实现
  • 原文地址:https://www.cnblogs.com/netcorner/p/2912548.html
Copyright © 2011-2022 走看看