1.文本框焦点问题onBlur:当失去输入焦点后产生该事件onFocus:当输入获得焦点后,产生该文件Onchange:当文字值改变时,产生该事件Onselect:当文字加亮后,产生该文件<input type="text" value="mm" οnfοcus="if(value=='mm) {value=''}" οnblur="if(value=='') {value='mm'}">点击时文字消失,失去焦点时文字再出现2.网页按钮的特殊颜色<inputtype=buttonname="Submit1" value="郭强" size=10class=s02style="background-color:rgb(235,207,22)">3.鼠标移入移出时颜色变化<inputtype="submit" value="找吧"name="B1" onMouseOut=this.style.color="blue"onMouseOver=this.style.color="red"class="button">4.平面按钮<inputtype=submitvalue=订阅 style="border:1px solid :#666666; height:17px; width:25pt; font-size:9pt;BACKGROUND-COLOR: #E8E8FF; color:#666666" name="submit">5.按钮颜色变化<inputtype=text name="nick" style="border:1px solid #666666; font-size:9pt; height:17px;BACKGROUND-COLOR: #F4F4FF; color:#ff6600" size="15" maxlength="16">6.平面输入框<inputtype="text" name="T1" size="20" style="border-style: solid; border-width: 1">7.使窗口变成指定的大小<script>window.resizeTo(300,283);</script>8.使文字上下滚动<marqueedirection=upscrollamount=1scrolldelay=100οnmοuseοver='this.stop()'οnmοuseοut='this.start()'height=60><!-- head_scrolltext --><tr><td>共和国</table><!-- end head_scrolltext--></marquee>9.状态栏显示该页状态<baseοnmοuseοver="window.status='网站建设 http://www.webmake.cn/' ;return true">10.可以点击文字实现radio选项的选定<br>&nbsp;&nbsp;&nbsp;&nbsp;<inputtype="radio" name="regtype" value="A03" id="A03"><labelfor="A03">情侣 : 一次注册两个帐户</label><br>11.可以在文字域的font写onclick事件12.打印</a>打印网页<a href='javascript:window.print()'>13.线型输入框<inputtype="text" name="key" size="12" value="关键字" onFocus=this.select()onMouseOver=this.focus()class="line">14.显示文档最后修改日期<scriptlanguage=javascript>function hi(str){ document.write(document.lastModified) alert("hi"+str+"!")}</script>15.可以在鼠标移到文字上时就触发事件<html><head><scriptlanguage="LiveScript"><!-- Hiding function hello() { alert("哈罗!"); }</script></head><body><ahref="" onMouseOver="hello()">link</a></body></html>16.可以根据网页上的选项来确定页面颜色<HTML><HEAD><TITLE>background.html</TITLE></HEAD><SCRIPT><!--function bgChange(selObj) {newColor = selObj.options[selObj.selectedIndex].text; document.bgColor= newColor; selObj.selectedIndex=-1;}//--></SCRIPT><BODYSTYLE="font-family:Arial"><B>Changing Background Colors</B><BR><FORM><SELECT SIZE="8" onChange="bgChange(this);"><OPTION>Red<OPTION><OPTION>Yellow<OPTION><OPTION>Blue<OPTION><OPTION>Violet<OPTION><OPTION>pink<OPTION></SELECT></FORM></BODY></HTML>17.将按钮的特征改变<styletype="text/css"><!--.style1{ font-size: 12px; background: #CCCCFF; border-width: thin thin thin thin; border-color: #CCCCFF#CCCCCC #CCCCCC #CCCCFF}.style2{ font-size: 12px; font-weight: bold; background: #CCFFCC; border-width: thin medium medium thin;border-color: #CCFF99 #999999 #999999 #CCFF99}--></style>  

本例按钮的代码如下:<inputtype="submit" name="Submit" value="提 交" οnmοuseοver="this.className='style2'"οnmοuseοut="this.className='style1'" class="style1">18.改变按钮的图片.<styletype="text/css"><!--.style3{font-size: 12px; background: url(image/buttonbg1.gif); border: 0px; width: 60px; height: 22px

}.style4{font-size: 12px; font-weight: bold; background: url(image/buttonbg2.gif); border: 0px 0; width:60px; height: 22px

}--></style>  

本例的按钮代码如下:<inputtype="submit" name="Submit2" value="提 交" οnmοuseοver="this.className='style4'"οnmοuseοut="this.className='style3'" class="style3">19.打印页面<divalign="center"><aclass=contenthref="javascript:doPrint();">打印本稿</a></div>20.可以直接写html语言document.write("");21.改变下拉框的颜色<selectname="classid"onChange="changelocation(document.myform.classid.options[document.myform.classid.selectedIndex].value)"size="1" style="color:#008080;font-size: 9pt">22.转至目标URLwindow.location=http://guoguo23.传递该object的formUpdateSN('guoqiang99267',this.form)function UpdateSN(strValue,strForm){ strForm.SignInName.value = strValue; return false;}24.文字标签<labelfor="AltName4"><inputname="AltName" type="RADIO" tabindex="931" id="AltName4">guoqiang99859</label>25.layer2为组件的ID,可以控制组件是否可见document.all.item('Layer2').style.display = "block";document.all.item('Layer2').style.display = "none";//

26.将页面加入favorite中<scriptlanguage=javascript><!--function Addme(){url ="http://your.site.address";//你自己的主页地址title="Your Site Name";//你自己的主页名称window.external.AddFavorite(url,title);--></script>//27.过10秒自动关闭页面< scriptlanguage="JavaScript">function closeit() {setTimeout("self.close()",10000)}< /script>28.可以比较字符的大小char=post.charAt(i);if(!('0'<=char&&char<='9'))29.将字符转化为数字month = parseInt(char)30.点击value非空的选项时转向指定连接 <select οnchange='if(this.value!="")window.open(this.value)'class="textinput"><option selected>主办单位</option><option>-----------------</option><option value="http://www.bjd.com.cn/">北京日报</option><option value="http://www.ben.com.cn/">北京晚报</option></select>31.改变背景颜色<tdwidth=* class=dp bgColor=#FAFBFCοnmοuseοver="this.bgColor='#FFFFFF';"οnmοuseοut="this.bgColor='#FAFBFC';">32.改变文字输入框的背景颜色<style>.input2{background-image: url('../images/inputbg.gif'); font-size: 12px; background-color:#D0DABB;border-top-width:1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}</style><inputname=contenttype=text size="47" class="input2" maxlength="50">33.改变水平线的特征<hrsize="0" noshade color="#C0C0C0">34.传递参数的方式<ahref="vote.asp?CurPage=8&id=3488">8</a>35.页内跳转<a href="#1">1</a><ahref="#2">2</a><ahref="#3">3</a><ahref="#4">4</a><ahref="#5">5</a><ahref="#6">6</a><ahref="#7">7</a><aname="1">dfdf</a><aname="2">dfdf</a>//36.两个按键一起按下if(event.ctrlKey && window.event.keyCode==13)//

37.刷新页面javascript:this.location.reload()//

38.将网页的按钮使能<SCRIPTLANGUAGE="JavaScript">function haha(){ for(var i=0;i<document.form1.elements.length;i++) {if(document.form1.elements[i].name.indexOf("bb")!=-1) document.form1.elements[i].disabled=!document.form1.elements[i].disabled; }}</SCRIPT><BODY><formname=form1><INPUTTYPE="button" NAME="aa " value=cindyοnclick=haha()><INPUTTYPE="button" NAME="bb " value=guoguo><INPUTTYPE="button" NAME="bb " value=guoguo>39.文字移动<marqueescrollamount=3οnmοuseοver=this.stop();οnmοuseοut=this.start();>40.双击网页自动跑<SCRIPTLANGUAGE="JavaScript">var currentpos,timer;function initialize(){timer=setInterval("scrollwindow()",1);}function sc(){ clearInterval(timer);}function scrollwindow(){currentpos=document.body.scrollTop; window.scroll(0,++currentpos);if (currentpos!= document.body.scrollTop) sc();}document.onmousedown=scdocument.οndblclick=initialize</SCRIPT>//41.后退<INPUTTYPE="button" οnclick=window.history.back()value=back>42.前进<INPUTTYPE="button" οnclick=window.history.forward()value=forward>43.刷新<INPUTTYPE="button" οnclick=document.location.reload()value=reload>44.转向指定网页document.location="http://ww"或者document.location.assign(http://guoguo.com)45.在网页上显示实时时间<SCRIPTLANGUAGE="JavaScript">var clock_id;window.οnlοad=function(){ clock_id=setInterval("document.form1.txtclock.value=(new Date);",1000)}</SCRIPT>//46.可以下载文件document.location.href="目标文件"//

47.连接数据库import java.sql.*;String myDBDriver="sun.jdbc.odbc.JdbcOdbcDriver";Class.forName(myDBDriver);Connection conn=DriverManager.getConnection("jdbc:odbc:firm","username","password");Statement stmt=conn.createStatement();ResultSet rs=stmt.executeQuery(sql);rs.getString("column1");//

48.可以直接在页面“div”内写下所需内容<INPUTTYPE="button" οnclick="a1.innerHTML='<font color=red>*</font>'"><divid=a1></div>//49.可以改变页面上的连接的格式,使其为双线<style>A:link {text-decoration: none; color:#0000FF; font-family: 宋体}A:visited {text-decoration: none; color: #0000FF; font-family:宋体}A:hover {text-decoration: underline overline; color: FF0000}</style><style>A:link {text-decoration: none; color:#0000FF; font-family: 宋体}A:visited {text-decoration: none; color: #0000FF; font-family:宋体}A:hover {text-decoration: underline overline line-through; color: FF0000}TH{FONT-SIZE: 9pt}TD{FONT-SIZE: 9pt}body {SCROLLBAR-FACE-COLOR: #A9D46D; SCROLLBAR-HIGHLIGHT-COLOR: #e7e7e7;SCROLLBAR-SHADOW-COLOR:#e7e7e7;SCROLLBAR-3DLIGHT-COLOR: #000000; LINE-HEIGHT: 15pt;SCROLLBAR-ARROW-COLOR: #ffffff;SCROLLBAR-TRACK-COLOR: #e7e7e7;}INPUT{BORDER-TOP-WIDTH: 1px;PADDING-RIGHT: 1px;PADDING-LEFT: 1px; BORDER-LEFT-WIDTH: 1px;FONT-SIZE:9pt; BORDER-LEFT-COLOR: #cccccc;BORDER-BOTTOM-WIDTH: 1px; BORDER-BOTTOM-COLOR: #cccccc;PADDING-BOTTOM: 1px; BORDER-TOP-COLOR: #cccccc;PADDING-TOP: 1px; HEIGHT: 18px; BORDER-RIGHT-WIDTH: 1px; BORDER-RIGHT-COLOR: #cccccc}DIV,form ,OPTION,P,TD,BR{FONT-FAMILY: 宋体;FONT-SIZE: 9pt}textarea, select{border-width: 1; border-color: #000000;background-color: #efefef;font-family: 宋体;font-size: 9pt; font-style: bold;}.text{ font-family: "宋体"; font-size: 9pt;color: #003300; border: #006600 solid; border-width: 1px 1px1px 1px}</style>

完整的css50.新建frame<ahref="javascript:newframe('http://www.163.net/help/a_little/index.html','http://www.163.net/help/a_little/a_13.html')"><imgalt=帮助 border=0 src="http://bjpic.163.net/images/mail/button-help.gif"></a>

转载于:https://www.cnblogs.com/kingfly/archive/2013/05/21/3090298.html

200多个js技巧代码相关推荐

  1. 我们爱分享----200多个js技巧代码

    [javascript] view plaincopy 1.文本框焦点问题 onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 Onchange:当文字值改变时,产 ...

  2. 200多个js技巧代码(4)

    2019独角兽企业重金招聘Python工程师标准>>> 106.动态改变类型 <style> .Overnone { border-width:0;background- ...

  3. 【转载】200多个js技巧代码

    1.文本框焦点问题 onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 Onchange:当文字值改变时,产生该事件 Onselect:当文字加亮后,产生该文件 & ...

  4. 200多个js技巧代码(五)

    161.标题栏 document.title//162.背景图片 <body style="BACKGROUND-ATTACHMENT: fixed" background= ...

  5. js经典代码200句

    200多个js技巧代码 1.文本框焦点问题 onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 Onchange:当文字值改变时,产生该事件 Onselect:当文 ...

  6. 常用网页使用js技巧收集(200多个)经典

    常用网页使用js技巧收集(200多个)经典 1.文本框焦点问题 onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 Onchange:当文字值改变时,产生该事件 O ...

  7. js 技巧杂引(转)

    js 技巧杂引(转) posted on 2005年9月28日 1:12 由 Snow 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释 ...

  8. js技巧--转义符\的妙用

    js技巧--转义符"\"的妙用 // blueDestiny, never-online // blueDestiny [at] 126.com 通常,我们在动态给定一个conta ...

  9. vuejs粒子动画特效 npm安装插件vue-particles(particles.js) - 代码篇

    文章目录 1. npm 安装插件`vue-particles` 2. 效果图: 3. 代码截图: 4. 代码示下: 5. 附件 · 文章阅读: 1. npm 安装插件vue-particles npm ...

最新文章

  1. 2022泰晤士最新世界大学排名惹争议,这所985高校爆冷门!
  2. BAPC2014 Bamp;amp;HUNNU11582:Button Bashing(BFS)
  3. clion 远程调试配置失败 Failed to reload 错误
  4. MVC小型商务网站实例(2)--项目架构
  5. shell 获取命令执行结果_java高并发系列 第31天:获取线程执行结果,这6种方法你都知道?...
  6. 基于CAD/CAM的三维控件
  7. 牛客16426 玩具谜题
  8. 深度 | 数据仓库分层存储技术揭秘
  9. 提款机转账多久到账?
  10. 架构如何为业务和技术“服务”(2)
  11. 镇楼篇--转行初入IT的心路历程
  12. Pr 入门教程如何修改过渡效果设置?
  13. wav转mp3格式转换器哪个好
  14. Gentoo搭建PPTP服务器
  15. Excel 怎么验证身份证号码是否重复
  16. openwrt安装ipk报错“incompatible with the architectures configured”
  17. Airtest自动化测试——批量执行脚本(实测)
  18. 【人工智能 AI】机器学习快速入门教程(Google)
  19. zynq linux环境移植,ZYNQ 7030 Linux 系统移植
  20. 约瑟夫环——递推公式详解(leetcode 1823. 找出游戏的获胜者)

热门文章

  1. Lombok中关于@Data的使用
  2. alias中后面的命令不执行的问题(没有解决 )
  3. SyntaxError: (hbase):100: syntax error, unexpected tIDENTIFIER
  4. ubuntu19.10安装remarkable
  5. Cython与CPython的区别
  6. ubuntu linux下面用wine运行大航海时代4和最新版的QQ
  7. 神经网络optimizer的发展历史整理
  8. 【机器学习】主题模型
  9. elisa标准曲线怎么做_如何合理绘制ELISA标准曲线要点
  10. JAVA中String类的intern()方法的作用