这篇日志都是一些JavaScript的基础,熟悉JavaScript的请出门左转。
一、创建新窗口
创建新窗口的应用一般在:创建一个新的窗口显示网页。其格式是:window.open(URL,TargetName, sizeInfo);
例子:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>测试创建新的窗口</title> </head> <body> <script type="text/javascript"> var newWindow ; <!--以全局变量的形式给出窗口对象,在以下的所有方法中均能使用--> function createWindow(){ <!--Script1.html是另一个相对的文档地址 --> newWindow = window.open("Script1.html", "", "height = 800 ,width=600"); } function closeWindow(){ if(null != newWindow){ newWindow.close(); newWindow = null; } } function Redirect(){ if(null != newWindow){ newWindow.location.href = "ScriptLoadTime.html"; } } </script> <h1>测试创建新的窗口 </h1> <form > <input type="button" value="Create new Window" οnclick="createWindow()"> <input type="button" value="Close new Window" οnclick="closeWindow()"> <input type="button" value="Redir current Window" οnclick="Redirect()"> </form> </body> </html>
很简单不是么。还有一点,通过获取子窗口的引用(在上面的例子中就是newWindow对象),便可以管理和控制子窗口。
二、创建对话框
在JavaScript 中,一般有3种对话框:警告框、确认框、提示框。
以下是示例:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>测试创建对话框和重定向</title> </head> <body> <script type="text/javascript"> function createAlertDialog(){ window.alert("您创建了一个警告对话框!!按钮OK关闭对话框!!"); } function createConfirmDialog(){ var b = window.confirm("您创建了一个确认对话框!!按钮OK将返回一个true,而cancel按钮将返回一个false"); document.getElementById("showPlace").innerHTML = "您执行了createConfirmDialog操作,其输出结果是:"+b; } function createPromptDialog(){ var b = window.prompt("请输入您的名字:","默认值:汤立"); document.getElementById("showPlace").innerHTML = "您执行了createPromptDialog操作,您输入的内容是:"+b; } function testRedir(){ var b = window.prompt("请输要转的网站:","Script1.html"); self.location.href = b; } </script> <h1>测试创建对话框 </h1> <div id="showPlace"> </div> <form > <input type="button" value="createAlertDialog" οnclick="createAlertDialog()"> <input type="button" value="createConfirmDialog" οnclick="createConfirmDialog()"> <input type="button" value="createPromptDialog" οnclick="createPromptDialog()"> </form> <h1>测试重定向功能 </h1> <form > <input type="button" value="Redir至某网站" οnclick="testRedir()"> </form> </body> </html>
也是很简单的。
alert()方法无返回值
confirm()方法返回一个布尔值,false或true
prompt()方法返回一个String对象,当按cancle或X时,返回null
只是我在练习这里的时候还有一个问题。通过对location.href 属性赋值,也只能重定向到本地文档(即当前文档的同目录下或者同父目录下),我还是不知道怎么重定向至像www.google.com这样的外部URL地址。
吐槽:这篇日志的含金量真心低啊