Java Script Java Script 1 Java Script 2
![链接式翻转器 v v v v window. onload=setup; function setup(){ var thislinks= document. links[0]; //获取链接对象](https://slidetodoc.com/presentation_image_h2/6feef3d09b2876bc4aa699c5d4afbb47/image-93.jpg "链接式翻转器 v v v v window. onload=setup; function setup(){ var thislinks= document. links[0]; //获取链接对象")
- Slides: 118
Java. Script
一、了解Java. Script 1. 了解Java. Script 2. Java. Script与Java 3. Java. Script与Java不同点 4. Java. Script 作流程 5. Java. Script可以做什么 6. Java. Script不可以做什么
脚本写在哪里？ src=… HTML文档 <HTML> <HEAD> ……. . . </HEAD> <BOYD> ……. . . </BODY> </HTML> <SCRPT > function HELLO() { …………. } </SCRIPT>
第一个Java. Script程序 v <html> v <body> v <script type="text/javascript"> v document. write("Hello World!"); v </script> v </body> v </html>
在脚本中写注释 v v 两种注释示例 /* …*/ 与 //… /*This is an example of a long Java. Script comment. Note the characters at the beginning ending of the comment. */ Function Emg(){ // This is write. Message. …… }
弹出对话框 三种对话框 <script> function Dialog. Box() { v //alert(‘welcome!’); 一个按钮 // confirm(‘can you speak english? ’); 两个按钮 prompt (“how old are you? ”, ” 23”); 有默认回答，两个按钮 } </script>
关闭一个浏览器窗口 v 两种关闭方式 标签关闭与按钮关闭 <a href="javascript: self. close()">关闭窗口</a> <script > function NVGClose() { window. close(); } </script> <input type="button" value="关闭" onclick=“NVGClose()">
Java. Script函数 v 在函数的定义中，我们看到函数名后有参数表，这些参数变量可能是一 个或几个。那么怎样才能确定参数变量的个数呢？在Java. Script中可通 过arguments. Length来检查参数的个数。 Function function_Name(exp 1, exp 2, exp 3, exp 4){ Number =function _Name. arguments. length; if (Number>1） document. wrile(exp 2); if (Number>2) document. write(exp 3); if(Number>3) document. write(exp 4); }
错误处理 基本语句 try/throw/catch try{ 语句块… throw new Error(“…”); } catch(err. Msg) { alert(err. Msg. message); } v eg: function Age() { try { var m="age"; var n=20; document. write(parse. Int(m)+n); //抛出语句 throw new Error("not a valid number"); } catch (err. Msg) { alert(err. Msg. message); } }
自定义构造函数 // 实际的用来显示 past 对象内容的函数。 function pasta. To. String() { // 返回对象的属性。 return "Grain: " + this. grain + "n" + "Width: " + this. width + "n" + "Shape: " + this. shape + "n" + "Egg? : " + Boolean(this. has. Egg); }
自定�� 象 <script language="javascript"> function Student(name){ this. name = name; this. get. Name = get. Name; } function get. Name(){ return this. name; } function Button 1_onclick() { var s = new Student("lijie", 20, "asdad", "13971212"); alert(s. get. Name()); alert(s. name); } </script>
使用自己的� 象 定义了对象构造器后，用 new 运算符创建对象实例。 var spaghetti = new pasta("wheat", 0. 2, "circle", true); // 将调用 to. String() 并显示 spaghetti 对象 的属性。 window. alert(spaghetti);
使用原型对象 例如，如果想要能够删除字符串的前后空格（与 VBScript 的 Trim 函数类似），就 可以给 String 原型对象创建自己的方法。 String. prototype. trim = function(){ // 用正则表达式将前后空格用空字符串替代。 return this. replace(/(^s*)|(s*$)/g, ""); } var s = " leading and trailing spaces "; // 显示 " leading and trailing spaces (35)" window. alert(s + " (" + s. length + ")"); // 删除前后空格 s = s. trim(); // 显示"leading and trailing spaces (27)" window. alert(s + " (" + s. length + ")");
数� 和� 象 由于所有的数组也是对象，也支持expando属性。请注意，虽然如此，添加 的属性并不以任何方式与 length 属性相交互。例如： // 三个元素的数组 var my. Array = new Array(3); my. Array[0] = "Hello"; my. Array[1] = 42; my. Array[2] = new Date(2000, 1, 1); window. alert(my. Array. length); // 显示数组的长度 3 my. Array. expando = "JScript!"; // 添加某些 expando 属性 my. Array["another Expando"] = "Windows"; // 仍然显示 3，因为两个 expando 属性，并不影响长度。 window. alert(my. Array. length);
浏览器对象(Navigator) v v v v Eg: <Script> var len = navigator. plugins. length; with (document) { write ("你的浏览器共支持" + len + "种外挂插件：<BR>"); write ("<TABLE BORDER=0>") write ("<CAPTION>外挂插件清单</CAPTION>") write ("<TR><TH>名称<TH>描述<TH>文件名") for (var i=0; i<len; i++) write("<TR><TD>" + i + "<TD>" + navigator. plugins[i]. name + "<TD>" + navigator. plugins[i]. description + "<TD>" + navigator. plugins[i]. filename); } </Script>
屏幕对象(screen) v v v v Eg： <Script> if ( screen. width < 800 || screen. color. Depth < 8 ) { var msg = "本网站最佳浏览模式为 800 * 600 * 256"; alert(msg); } </Script>
窗口对象(Windows) v v Eg： <Script> function cfm() { v v v if (confirm("确定离开么? ")) //关闭当前窗口, 下面两个方法都可以 //window. close(); self. close(); else return false v v v } v v </Script>
位置对象(Location) v Eg: <input type="button" value="连接到 163" on. Click="location. href='http: //www. 163. com'"> v <input type="button" value="刷新页面" onclick="location. reload()" /> v <input type="button" value="替换页面" onclick="location. replace('2. html')" /> v
历史对象(History) v v v Eg: <a href="history. go(-2)">后退两页</a> <a href="history. back()">后退一页</a> <a href="history. forward()">前进一页</a> <a href="history. go(2)">前进两页</a>
DOM结构图 html v v v v <html> <head> <title>My page</title> </head> <body> </body> <p>This is text on my page</p> </html> head body title p text “My page” “This is text on my page”
添加节点 v v v v Eg： <html> <head> <script src="E: script 01. js"> </script> </head> <body> <form> <p><textarea id="text. Area" rows="5"cols="30"></textarea></p> <input type="submit" value="Add some text to the page"/> </form> </body> </html>
添加节点 v v v window. onload=init. All; function init. All(){ document. get. Elements. By. Tag. Name("form")[0]. onsubmit=function(){return add. Node(); } } function add. Node(){ var in. Text =document. get. Element. By. Id("text. Area"). value; var new. Text=document. create. Text. Node(in. Text) ; var new. Graf=document. create. Element(“p”); new. Graf. append. Child(new. Text); var doc. Body=document. get. Elements. By. Tag. Name("body")[0]; doc. Body. append. Child(new. Graf); return false; v v }
添加节点 v v var new. Text=document. create. Text. Node(in. Text) ; //使用create. Text. Node()方法创建一个新的文本节点（名为 new. Text），它将包含在text. Area中找到的文本。 v var new. Graf=document. create. Element(“p”); //create. Element()方法使用创建一个新的元素节点，()里的内 容可以是任何HTML容器。 v new. Graf. size=“ 15”//给属性 v
删除节点 v v v var all. Grafs=document. get. Elements. By. Tag. Name("p"); if(all. Grafs. length>1) { var last. Graf=all. Graffs. item(all. Grafs. length-1) var doc. Body=document. get. Elements. By. Tag. Name("body")[0] doc. Body. remove. Child(last. Graf) }
低级翻转器 <a href="" onmouseover="document. arrow. src='arrow_on. jpg'" onmouseout="document. arrow. src='arrow_off. jpg'"><img src="arrow_off. jpg" border="0" name="arrow" id="arrow" alt="arrow"/></a> v v 缺点：察觉到延迟，需要下载 onmouseover="document. arrow. src='arrow_on. jpg'" onmouseout="document. arrow. src='arrow_off. jpg'" 释： 当鼠标移动到图片上或离开，<img src=>重定向到另一张图片
高级翻转器 v v v v window. onload=setup; function setup() { var this. Image= document. images[0]; //获取图像 this. Image. out. Image=new Image(); //定义图像的属性为一图像 this. Image. out. Image. src=this. Image. src; //定义属性指向的地址 this. Image. onmouseout=rollout; //调用事件 this. Image. over. Image=new Image(); this. Image. over. Image. src="arrow_on. jpg"; this. Image. onmouseover=rollover; v v }
优点：一次性将图片下载到客户段 高级翻转器 的内存当中，不会出现延时。 v v v v function rollout() { this. src=this. out. Image. src; } function rollover() { this. src=this. over. Image. src; }
链接式翻转器 v v v v window. onload=setup; function setup(){ var thislinks= document. links[0]; //获取链接对象 thislinks. this. Image=document. images[0]; //定义属性 thislinks. out. Image=new Image(); thislinks. out. Image. src=this. Image. src; thislinks. onmouseout=rollout; thislinks. over. Image=new Image(); thislinks. over. Image. src="arrow_on. jpg"; thislinks. onmouseover=rollover; v v }
链接式翻转器 v v v v function rollout() { this. Image. src=this. out. Image. src; } function rollover() { this. Image. src=this. over. Image. src; }
三状态翻转器 v v v v 三状态翻转器就是在高级翻转器中加入一条点击的过程中出 现的图片； this. Image. onclick. Image=new Image(); this. Image. onclick. Image. src="图片地址"; this. Image. onclick=roll. Click; function roll. Click() { this. src=this. onclick. Image. src; }
一个简单的框架 v v v v scrolling：是否显示滚动条 <html> noresize: 是否允许调整框架 <head> 大小 </head> <frameset cols="30%, 70%" > <frame src="1. html" name="left" id="left" scrolling="yes" noresize/> <frame src="2. html" name="content" id="content" /> </frameset> </html>
迫使站点显示在框架中 v v var frameset. Page = "frameset 3. html"; var curr. Page = just. The. Filename(self. location. pathname); v if (top. location == self. location && frameset. Page != curr. Page) { self. location. replace(frameset. Page + "? " + curr. Page); } v 检查top. location是否与self. location相同 v v
迫使站点显示在框架中 v window. onload = chg. Frame; v function chg. Frame() { if (top. location == self. location && document. location. search) { var link. URL = just. The. Filename(document. location. search); var content. Win = document. get. Element. By. Id("content"). content. Window; var curr. URL = just. The. Filename(content. Win. location. pathname); v v if (curr. URL != link. URL) { content. Win. location. replace(link. URL); } v v v }
迫使站点显示在框架中 v v function just. The. Filename(this. File) { if (this. File. index. Of("/") > -1) { this. File = this. File. substring(this. File. last. Index. Of("/")+1); } v if (this. File. index. Of("? ") == 0) { this. File = this. File. substring(1); } v return this. File; v v v }
创建和装载动态框架 v window. onload = init. Links; v function init. Links() { for (var i=0; i<document. links. length; i++) { document. links[i]. onclick = write. Content; document. links[i]. this. Page = i+1; } } v v v v function write. Content() { var new. Text = "<h 1>You are now looking at page " + this. Page + ". </h 1>"; v var content. Win = parent. document. get. Element. By. Id("content"). content. Window; content. Win. document. body. inner. HTML = new. Text; return false; v v }
在框架间共享函数 v var banner. Array = new Array("images/red. Banner. gif", "images/green. Banner. gif", "images/blue. Banner. gif"); v window. onload = init. Frames; v function init. Frames() { var left. Win = document. get. Element. By. Id("left"). content. Window. document; v for (var i=0; i<left. Win. links. length; i++) { left. Win. links[i]. target = "content"; left. Win. links[i]. onclick = reset. Banner; } v v v set. Banner(); v v }
在框架间共享函数 v v v function set. Banner() { var content. Win = document. get. Element. By. Id("content"). content. Window. document; var random. Num = Math. floor(Math. random() * banner. Array. length); v v v content. Win. get. Element. By. Id("ad. Banner"). src = banner. Array[random. Num]; } function reset. Banner() { set. Timeout("set. Banner()", 1000); }
用javascript装载iframe v window. onload = initi. Frame; v function initi. Frame() { for (var i=0; i<document. links. length; i++) { document. links[i]. target = "content"; document. links[i]. onclick = seti. Frame; } } v v v v v function seti. Frame() { document. get. Element. By. Id("content"). content. Window. document. location. href = this. href; return false; }
选择并转移导航菜单 v v v v v window. onload = init. Form; window. onunload = function() {}; function init. Form() { document. get. Element. By. Id("new. Location"). selected. Index = 0; document. get. Element. By. Id("new. Location"). onchange = jump. Page; } function jump. Page() { var new. Loc = document. get. Element. By. Id("new. Location"); var new. Page = new. Loc. options[new. Loc. selected. Index]. value; if (new. Page != "") { window. location = new. Page; } v v }
Onresize事件 v window. onresize = resize. Fix; v if (document. layers) { var orig. Width = window. inner. Width; var orig. Height = window. inner. Height; } v v v function resize. Fix() { if (document. layers) { if (window. inner. Width != orig. Width || window. inner. Height != orig. Height) { window. location. reload(); } } } 重置窗体大小事件
Onfocus事件 v Onfocus事件与onblur正好相反，当一个页面成为最前面的活动窗口时， 就会触发onfocus事件。 v window. onfocus = move. Back; v function move. Back() { self. blur(); } v v
鼠标事件处理 v v v v Onmousedown事件 Onmouseup事件 Onmousemove事件 Onmouseover事件 Onmouseout事件 Ondblclick事件 Onlick事件
Ondblclick事件 v window. onload = init. Images; v function init. Images() { for (var i=0; i<document. images. length; i++) { document. images[i]. ondblclick = new. Window; } } v v v v v function new. Window() { var img. Name = "images/" + this. id + ". jpg" var img. Window = window. open(img. Name, "img. Win", "width=320, height=240, scrollbars=no") } 双击事件
Onblur事件 v window. onload = init. Form; v function init. Form() { var all. Tags = document. get. Elements. By. Tag. Name("*"); v for (var i=0; i<all. Tags. length; i++) { if (all. Tags[i]. class. Name. index. Of("reqd") > -1) { all. Tags[i]. onblur = field. Check; } } v v v } v function field. Check() { if (this. value == "") { this. style. background. Color = "#FFFF 99"; this. focus(); } else { this. style. background. Color = "#FFFFFF"; } } v v v v
Onkeydown事件 v v v v document. onkeydown = key. Hit; var this. Pic = 0; function key. Hit(evt) { var my. Pix = new Array("images/callisto. jpg", "images/europa. jpg", "images/io. jpg", "images/ganymede. jpg"); var img. Ct = my. Pix. length-1; var lt. Arrow = 37; var rt. Arrow = 39; var this. Key = (evt) ? evt. which : window. event. key. Code; v v if (this. Key == lt. Arrow) { chg. Slide(-1); } else if (this. Key == rt. Arrow) { chg. Slide(1); } return false; v v v v function chg. Slide(direction) { this. Pic = this. Pic + direction; if (this. Pic > img. Ct) { this. Pic = 0; } if (this. Pic < 0) { this. Pic = img. Ct; } document. get. Element. By. Id("my. Picture"). src = my. Pix[this. Pic]; } v v v }
"java script"
Java script classes
"java script"
Java scrept
Java script email
"java script"
Khan academy object oriented programming
Java script wikipedia
Js ide
Java script course
Java script examples
"java script"
"language fundamentals"
"java script"
Java script
Script de java
.inside which html element do we put the javascript?
Random class java
Pengertian awt dan swing pada java
Ejb remote vs local
Java util import
Java import java.io.*
Import java.util.scanner;
Import java.awt.event
Import java.io.file
Import java
Import java.util.*
Java compiler translates java source code into
Java gcd
Java thread import
Import java.awt
Thumbelina toad
The twits bbc
Cookie stealing script for facebook
James lott script health
Script
Webinar housekeeping script
Role play tourist guide
It is the paradigm shift of script kiddies to crime bosses
Uat agenda
Bella thorne fansite
Python script
Search engine script with crawler
Which two characters are detained by the watchmen
Transaction script pattern
Ag broadcasting ffa
Dear ate charo letter
Writing a monologue
Magkasintahan sina tenyong at juana
Dday script
Jacva
Script breakdown sheets
Advantages of script mode in python
Jaringan semantik keluarga
Imago therapy
Second life rotation script
Weather report script today
Taking order script
Illness script
Biowulf swarm
Poltergeist screenplay
Wonder one pager
Shell script dialog
Script pour prendre rendez vous
Camera directions in script
Edu script
Sorry wrong number climax
Acknowledgement of country kaurna script
Aladin script
Radio plug
Lion king everything the light touches script
Timeline for acts i-iii
Boucles violettes script pdf
Door knob menu meaning
Flocabualry
Xmouse script
Brigitta olsen
Lumerical sweep script
What did juliet say she would rather do than marry paris
Fatal error in client side script
Game analysis in transactional analysis
Innerer monolog
Script looks pada scratch
Scriptacademy
Eiei oops
Database link
Nersc job script generator
Break up conversation script
Script o.s meaning
Programlamanın tarihçesi
Contoh representasi pengetahuan
Condicional
The giving tree ending
Romeo and juliet balcony script
Script readyfill
Tragedy definition literature
Jesus is the greatest gift of all lyrics
Ano ang mga uri ng dula noong panahon ng kastila
Stranger than paradise script
Script html
Thesis manuscript
Schema and script in discourse analysis
Script looks pada scratch
Script mc
Algoritma scratch
Cd theory
Javascript sales tax script
Romeo and juliet act 4 questions
Fsa informative essay outline
Differenza tra frame e script
Pathfinder investiture ceremony script
Action script 3
Scoring a script
Maximo automation script duplicate record
Fundraising script sample
The brave monkey pirate summary
Gum story
Layunin ng akdang pampanitikan
Event introduction script
