BOM (Browser Object Model)即浏览器对象模型
window对象-浏览器上打开的一个窗口
浏览器可以通过调用系统对话框,向用户展示信息。 系统提供了三个函数,可以完成系统对话框的操作。
【注】window下的函数,都可以省略window直接去调用。原本:window.alert(""); alert(""); 【功能】直接弹出警告框 【参数】警告框上的内容 confirm("");ru 【功能】弹出一个带有确认和取消按钮的警告框 【返回值】如果点击确定,返回true;如果点击取消,返回false prompt(""); 【功能】弹出一个带输入框的提示框。 【参数】第一个参数:要在提示框上显示的内容 第二个参数:输入框内默认值 【返回值】如果点击确定,返回值是输入的内容;如果点击取消,返回值是nullwindow.open() open() 【参数】 1.要加载的URL 2.窗口的名称或窗口的目标 3.一串具有特殊意义的字符串
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> window.onload = function(){ var oBtn = document.getElementById("btn"); oBtn.onclick = function(){ //open("http://www.baidu.com"); //【注】如果只有第一个参数,调用open方法会打开新的窗口。加载URL。 //open("http://www.baidu.com", "百度"); //【注】第二个参数,是给打开的新窗口起一个名字,然后以后,再去加载url,就在这个已经起好名字的目标窗口加载url open("http://www.baidu.com","百度", "widtn = 400, height = 400, top = 200, left = 200"); //【注】设置打开窗口的样式 } } </script> </head> <body> <input type = "button" value = "按钮" id = "btn" name=""> </body> </html>opener 打开当前窗口的父窗口的window对象(ie不支持)
opener.document.write("子窗口让我输出的");location 我们浏览器上地址栏上输入框 【注】它提供了与当前窗口中加载的文档有关的信息,还提供了一些导航功能。
location的一些属性
location.hash 锚点 #1 实现页内跳转
host 主机名:端口号 浏览器的端口号 默认8080 IP 通过IP我们可以在全球范围内,找到我这台电脑所使用的网络的地址 端口号 正在使用网络的软件,在当前电脑内唯一的标识
hostname 主机名 域名/IP 【注】域名就是给IP起一个好记的名字
href 整个url
pathname 路径名
port 端口号
protocol 协议 http:网络协议 file:本地文件协议
search 查询字符串 跟在?后面的部分
URL:统一资源定位符 protocol(协议):host(主机名):port(端口号)/pathname(路径)?search(查询字符串)#hash(锚点)
history.go(num); 当num=0;表示重载当前界面 当num>0;表示前进对应数量的记录 当num<0;表示后退对应数量的记录
封装函数解析search
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> /* ?id=5&search=ok 获取url中的search,通过传入对应key,返回key对应的value 例子:传入id,返回5 */ function getValue(search, key){ //<1>找出key第一次出现发位置 var start = search.indexOf(key); if(start == -1){ return; }else{ //<2>找出键值对,结束的位置 var end = search.indexOf("&", start); if(end == -1){ //这是最后一个键值对 end = search.length; } } //<3>将这个键值对提取出来 var str = search.substring(start, end); //<4>key = value 获取value var arr = str.split("=");//以=分割 return arr[1]; } var search = "id=5&search=ok" alert(getValue(search, "search")); </script> </head> <body> </body> </html>