精选文章 如何熟练操作JavaScript的55个技巧?(二)

如何熟练操作JavaScript的55个技巧?(二)

作者:wucms 时间: 2020-07-27 03:15:48
wucms 2020-07-27 03:15:48

31.TEXTAREA自适应文字行数的多少

<textarea rows=1 name=s1 cols=27 onpropertychange ="this.style.posHeight=this.scrollHeight"> textarea>

32. 日期减去天数等于第二个日期

<script language=Javascript> function cc(dd,dadd) { //可以加上错误处理 var a = new Date(dd) 

a = a.valueOf() 

a = a - dadd * 24 * 60 * 60 * 1000 

a = new Date(a) alert(a.getFullYear() + "年" + (a.getMonth() + 1) + "月" + a.getDate() + "日") } cc("12/23/2002",2) script>

33. 选择了哪一个Radio

<HTML> <script language="vbscript"> function checkme() for each ob in radio1 if ob.checked then

window.alert ob.value

next

end function script> <BODY> <INPUT name="radio1" type="radio" value="/style" checked>Style <INPUT name="radio1" type="radio" value="/blog/barcode">Barcode <INPUT type="button" value="check"  BODY> HTML>

34.脚本永不出错

<SCRIPT LANGUAGE="JavaScript">  return true; } 

window.onerror = killErrors; // --> SCRIPT>

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

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

36. 检测某个网站的链接速度:

把如下代码加入 <body>区域中: <script language=Javascript> 

tim=1 setInterval("tim++",100) 

b=1 var autourl=new Array() 

autourl[1]=1000){this.resized=true;this.style.width=1000;}" align=absMiddle border=0>www.njcatv.net" 

autourl[2]="javacool.3322.net" 

autourl[3]=1000){this.resized=true;this.style.width=1000;}" align=absMiddle border=0>www.sina.com.cn" 

autourl[4]="www.nuaa.edu.cn" 

autourl[5]=1000){this.resized=true;this.style.width=1000;}" align=absMiddle border=0>www.cctv.com" function butt(){ ***("

") for(var i=1;i <autourl.length;i++) ***(" +i+" size=10 value="/测试中……> =<input type=text

name=url"+i+" size=40> =<input type=button value="/blog/GO 

onclick=window.open(this.form.url"+i+".value)> <br>") ***(" ") } butt() function auto(url){ 

document.forms[0]["url"+b].value=url if(tim>200) {document.forms[0]["txt"+b].value="/链接超时"} else {document.forms[0]["txt"+b].value="/blog/时间"+tim/10+"秒"} 

b++ } function run(){for(var i=1;i <autourl.length;i++)***(" 如何熟练操作JavaScript的55个技巧?(二)1+autourl+"/"+Math.random()+" width=1 height=1 

onerror=auto("http://"+autourl+"")>")} run() script>

37. 各种样式的光标

auto :标准光标 default :标准箭头

hand :手形光标

wait :等待光标

text :I形光标

vertical-text :水平I形光标

no-drop :不可拖动光标

not-allowed :无效光标

help :?帮助光标

all-scroll :三角方向标

move :移动标

crosshair :十字标

e-resize

n-resize

nw-resize

w-resize

s-resize

se-resize

sw-resize

38.页面进入和退出的特效

进入页面 <meta http-equiv="Page-Enter" content="revealTrans(duration=x, transition=y)"> 

推出页面 <meta http-equiv="Page-Exit" content="revealTrans(duration=x, transition=y)"> 

这个是页面被载入和调出时的一些特效。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 以上22种随机选择一种

39.在规定时间内跳转

<META http-equiv=V="REFRESH" content="5;URL=http://www.fk007.com">

40.网页是否被检索

<meta name="ROBOTS" content="属性值"> 

其中属性值有以下一些: 

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

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

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

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

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

属性值为"nofollow": 文件不被检索,但可查询页上的链接。

41、email地址的分割

把如下代码加入 <body>区域中 <a href="fk007.com">fk007.com a>


42、流动边框效果的表格

把如下代码加入 <body>区域中 <SCRIPT> 

l=Array(6,7,8,9,‘a‘,‘b‘,‘b‘,‘c‘,‘d‘,‘e‘,‘f‘) 

Nx=5;Ny=35 

t=" +((Nx+2)*16)+"> for(x=Nx;x <Nx+Ny;x++) 

t+="

t+="

for(x=2;x <=Nx;x++) 

t+="

t+="

for(x=Ny;x>0;x--) 

t+="

***(t+"
+x+">
+(Nx-1)+"> +(Ny-2)+" rowspan="+(Nx)+"> +(Nx+Ny)+">
+(Nx-x)+"> +(Ny+Nx+x-1)+">
+(x+Nx*2+Ny-1)+">
"
) var N=Nx*2+Ny*2 function f1(y){ for(i=0;i <N;i++){ 

c=(i+y)%20;if(c>10)c=20-c

document.all["a_mo"+(i)].bgColor=""""#0000"+l[c]+l[c]+"‘"} 

y++ setTimeout(‘f1(+y+),1)} f1(1) SCRIPT>

43、JavaScript主页弹出窗口技巧

窗口中间弹出 <script> 

window.open("http://www.fk007.com","","width=400,height=240,top="+(screen.availHeight-240)/2+",left="+(screen.availWidth-400)/2); script> ============ <html> <head> <script language="LiveScript"> function WinOpen() { 

msg=open("","DisplayWindow","toolbar=no,directories=no,menubar=no"); 

msg.***(" 哈 罗! "); 

msg.***("

酷 毙 了!

这 是 JavaScript 所 开 的 视 窗!

"
); } script> head> <body> <form> <input type="button" name="Button1" value="Push me"  form> body> html> ============== 

一、在下面的代码中,你只要单击打开一个窗口,即可链接到赛迪网。而当你想关闭时,只要单击一下即可关闭刚才打开的窗口。

代码如下: <SCRIPT language="JavaScript"> <-- function openclk() { 

another=open(1000){this.resized=true;this.style.width=1000;}" align=absMiddle border=0>http://www.ccidnet.com‘,‘NewWindow‘); } function closeclk() { 

another.close(); } //--> SCRIPT> <FORM> <INPUT TYPE="BUTTON" NAME="open" value="/打开一个窗口" onClick="openclk()"> <BR> <INPUT TYPE="BUTTON" NAME="close" value="/blog/关闭这个窗口" onClick="closeclk()"> FORM> 

二、上面的代码也太静了,为何不来点动感呢?如果能给页面来个降落效果那该多好啊!

代码如下: <script> function drop(n) { if(self.moveBy){ 

self.moveBy (0-900); for(i = n; i > 0; i--){ 

self.moveBy(03); } for(j = 8; j > 0; j--){ 

self.moveBy(0,j); 

self.moveBy(j,0); 

self.moveBy(0-j); 

self.moveBy(-j,0); } } } script> <body onLoad="drop(300)"> 

三、讨厌很多网站总是按照默认窗口打开,如果你能随心所欲控制打开的窗口那该多好。

代码如下: <SCRIPT LANGUAGE="JavaScript"> <-- Begin function popupPage(l, t, w, h) { var windowprops = "location=no,scrollbars=no,menubars=no,toolbars=no,resizable=yes" + ",left=" + l + ",top=" + t + ",width=" + w + ",height=" + h; var URL = "http://www.80cn.com"; 

popup = window.open(URL"MenuPopup",windowprops); } // End --> script> <table> <tr> <td> <form name=popupform> <pre> 

打开页面的参数 <br> 

离开左边的距离: <input type=text name=left size=2 maxlength=4> pixels

离开右边的距离: <input type=text name=top size=2 maxlength=4> pixels

窗口的宽度: <input type=text name=width size=2 maxlength=4> pixels

窗口的高度: <input type=text name=height size=2 maxlength=4> pixels pre> <center> <input type=button value="打开这个窗口!" onClick="popupPage(this.form.left.value, this.form.top.value, this.form.width.value, this.form.height.value)"> center> form> td> tr> table>你只要在相对应的对话框中输入一个数值即可,将要打开的页面的窗口控制得很好。

44、页面的打开移动

把如下代码加入 <body>区域中 <SCRIPT LANGUAGE="JavaScript">  for (x = 20; x > 0; x--) { for (y = 10; y > 0; y--) { 

parent.moveBy(0,-x); } } for (x = 20; x > 0; x--) { for (y = 10; y > 0; y--) { 

parent.moveBy(0,x); } } for (x = 20; x > 0; x--) { for (y = 10; y > 0; y--) { 

parent.moveBy(x,0); } } for (x = 20; x > 0; x--) { for (y = 10; y > 0; y--) { 

parent.moveBy(-x,0); } } } //--> // End --> script>

45、显示个人客户端机器的日期和时间

<script language="LiveScript">  script>

46、自动的为你每次产生最後修改的日期了:

<html> <body> 

This is a simple HTML- page. <br> 

Last changes: <script language="LiveScript">  script> body> html>

47、不能为空和邮件地址的约束:

<html> <head> <script language="JavaScript">  if (form.text1.value == "") alert("您 没 写 上 任 何 东 西, 请 再 输 入 一 次 !") else { alert("嗨 "+form.text1.value+"! 您 已 输 入 完 成 !"); } } function test2(form) { if (form.text2.value == "" || 

form.text2.value.indexOf(‘@‘, 0) == -1) alert("这 不 是 正 确 的 e-mail address! 请 再 输 入 一 次 !"); else alert("您 已 输 入 完 成 !"); } // --> script> head> <body> <form name="first"> 

Enter your name: <br> <input type="text" name="text1"> <input type="button" name="button1" value="输 入 测 试" onClick="test1(this.form)"> <P> 

Enter your e-mail address: <br> <input type="text" name="text2"> <input type="button" name="button2" value="输 入 测 试" onClick="test2(this.form)"> body>

48、×××灯

<html> <head> <script language="JavaScript">  

pos++; var scroller=""; if (pos==lentxt) { 

pos=1-width; } if (pos <0) { for (var i=1; i <=Math.abs(pos); i++) { 

scroller=scroller+" ";} 

scroller=scroller+scrtxt.substring(0,width-i+1); } else { 

scroller=scroller+scrtxt.substring(pos,width+pos); } 

window.status = scroller; setTimeout("scroll()",150); } //--> script> head> <body onLoad="scroll();return true;"> 

这里可显示您的网页 ! body> html>

49、在网页中用按钮来控制前页,后页和主页的显示。

<html> <body> <FORM NAME="buttonbar"> <INPUT TYPE="button" VALUE="Back" onClick="history.back()"> <INPUT TYPE="button" VALUE="JS- Home" onClick="location=‘script.html‘"> <INPUT TYPE="button" VALUE="Next" onCLick="history.forward()"> FORM> body> html>

50、查看某网址的源代码

把如下代码加入 <body>区域中 <SCRIPT> function add() { var ress=document.forms[0].luxiaoqing.value

window.location="view-source:"+ress; } SCRIPT> 

输入要查看源代码的URL地址: <FORM> <input type="text" name="luxiaoqing" size=40 value="http://"> FORM> <FORM> <br> <INPUT type="button" value="查看源代码" onClick=add()> FORM>

51、title显示日期

把如下代码加入 <body>区域中: <script language="JavaScript1.2">  script>

52、显示所有链接

把如下代码加入 <body>区域中 <script language="JavaScript1.2">  var links=document.all.tags("A") var total=links.length var win2=window.open("","","menubar,scrollbars,toolbar") 

win2.***(" 一共有"+total+"个连接
") for (i=0;i <total;i++){ 

win2.***(" "+links.outerHTML+"
") } } //--> script> <input type="button" onClick="extractlinks()" value="显示所有的连接">

53、回车键换行

把如下代码加入 <body>区域中 <script type="text/javascript"> function handleEnter (field, event) { var keyCode = event.keyCode ? event.keyCode : event.which ? 

event.which : event.charCode; if (keyCode == 13) { var i; for (i = 0; i < field.form.elements.length; i++) if (field == field.form.elements) break; 

i = (i + 1) % field.form.elements.length; 

field.form.elements.focus(); return false; } else return true; } script> <form> <input type="text" onkeypress="return handleEnter(this, event)"> <br> <input type="text" onkeypress="return handleEnter(this, event)"> <br> <textarea>回车换行

54、确认后提交

把如下代码加入 <body>区域中 <SCRIPT LANGUAGE="JavaScript">  if (confirm("你确认要提交嘛!")) 

document.lnman.submit() } //--> SCRIPT> <form name="lnman" method="post" action=""> <p> <input type="text" name="textfield" value="确认后提交"> p> <p> <input type="button" name="Submit" value="提交"  p> form>

55、改变表格的内容

把如下代码加入 <body>区域中 <script ***script> var arr=new Array() 

arr[0]="一一一一一"; 

arr[1]="二二二二二"; 

arr[2]="三三三三三"; script> <select onchange="zz.cells[this.selectedIndex].innerHTML=arr[this.selectedIndex]"> <option value=a>改变第一格 option> <option value=a>改变第二格 option> <option value=a>改变第三格 option> select> <table id=zz border=1> <tr height=20> <td width=150>第一格 td> <td width=150>第二格 td> <td width=150>第三格 td> tr> table>

勿删,copyright占位
分享文章到微博
分享文章到朋友圈

上一篇:Hyper-V桥接方法和NAT网络地址转换配置方法

下一篇:vue的elementUi,阻止日期时间组件el-date-picker,在手机端弹出输入法

您可能感兴趣

  • 体制内必须要懂的道理77条

    1. 领导说“研究研究”,不要傻等,是要看你表现咋样。机关处处是机关,即使是你亲眼所见的也未必是事情的真相,凡事都要走心过脑,打个盹也别忘睁开半只眼。 2. 最忌讳虚张声势,真正有关系的人从来不多言,不要小看身边的每个人,踩着你上位的往往就是其中最不起眼的那个。 3. 与同事相处一定要记得亲者疏之、疏者亲之,过早暴露底牌,往往会成为最先被干翻的人。 4. 原则上可以,就是不可以;原则上不可以...

  • 研究生科研能力训练与培养答案课后习题

    网络选修课程研究生科研能力训练与培养尔雅答案 1.1测验 1【判断题】 研究生五个研里包含“研学”。X 2【判断题】 硕士=饱学之士。X 1.2测验 1 【单选题】 学会做学问,五句话,下面哪句不含在五句之中? D A、学会学 B、有学问 C、学中问 D、有智慧 2 【单选题】 学会做学问,以下总结,哪句不对?B A、勤学与好问 B、能学才会问 C、有问才有学 D、能问才会学 3【判断题】 ...

  • 【收藏】万字综述,核心开发者全面解读PyTorch内部机制

    (给机器学习算法与Python学习加星标,提升AI技能) 选自ezyang博客 作者:Edward Z. Yang 本文由机器之心(nearhuman2014)整理 斯坦福大学博士生与 Facebook 人工智能研究所研究工程师 Edward Z. Yang 是 PyTorch 开源项目的核心开发者之一。他在 5 月 14 日的 PyTorch 纽约聚会上做了一个有关 ,本文是他有关PyTo...

  • 论文翻译:Deep Learning for Anomaly Detection: A Review,异常检测的深度学习:回顾

    异常检测,又称离群点检测,几十年来一直是各个研究领域中一个持续而活跃的研究领域。仍然有一些独特的问题、复杂性和挑战需要先进的方法。近年来,深度学习使得异常检测成为可能。深部异常探测,已成为一个关键方向。本文综述了深度异常检测方法的研究进展,并对检测方法进行了综合分类,包括三个高级分类和三个高级分类11种方法的细粒度分类。我们回顾了他们的主要直觉、目标功能、基本假设、优势和劣势,并讨论了他们如...

  • 全栈面试题总结-十四道大厂

    防抖,顾名思义,防止抖动,以免把一次事件误认为多次,敲键盘就是一个每天都会接触到的防抖操作。 想要了解一个概念,必先了解概念所应用的场景。在 JS 这个世界中,有哪些防抖的场景呢 登录、发短信等按钮避免用户点击太快,以致于发送了多次请求,需要防抖 调整浏览器窗口大小时,resize 次数过于频繁,造成计算过多,此时需要一次到位,就用到了防抖 文本编辑器实时保存,当无任何更改操作一秒后进行保存...

  • LeetCode 一题多解 | 53. 最大子数组和:五种解法完全手册

    点击上方“五分钟学算法”,选择“星标”公众号 重磅干货,第一时间送达 作者:nettee 公众号:面向大象编程 一、原题描述 LeetCode 53. Maximum Subarray 最大子序和 二、全部解法 本文将介绍「最大子数组和」问题的以下五种解法: 其中,动态规划和贪心法其实是殊途同归,得到的是同样一份代码。分治法虽然时间复杂度不占优,却是最考验解题思路的一种方法。 本文对不同的解...

  • 最新Vue底层原理实现概述

    Vue,React这样的框架可以说是现在前端的必备技能,一个刚入门两三个月的前端都是要会Vue的,而且随着Vue3.0发布日程的推进,使用的人群变得多了,开始想去了解它。 Vue这么受大众接受,那么大家有没有想过一个问题?Vue,React这样的框架已经是基本功,我们有什么办法能运用得比别人厉害呢? 能够独立用Vue写一个项目其实只是入了一个门,在如今技术快速发展的背景下,要真的作为一个敢说...

  • 残差网络的前世今生与原理 | 赠书

    本文内容节选自《深度学习之模型设计:核心算法与案例实践》,作者言有三。本书详解了数十年来深层卷积神经网络模型的主流设计思想,理论讲解细致,实战案例丰富,是熟练掌握深度学习模型使用的必备参考资料。 想要了解关于深度学习的更多干货知识,关注AI科技大本营并评论分享你对本文的学习心得或深度学习实践的见解,我们将从中选出10条优质评论,各送出《深度学习之模型设计:核心算法与案例实践》一本+作者精心准...

华为云40多款云服务产品0元试用活动

免费套餐,马上领取!
CSDN

CSDN

中国开发者社区CSDN (Chinese Software Developer Network) 创立于1999年,致力为中国开发者提供知识传播、在线学习、职业发展等全生命周期服务。
文中提到的产品 (

0

)