JavaScript_BOM对象

Window对象

1. 系统对话框

   1. 浏览器通过(实际是window对象的方法) alert(),confirm(),prompt()方法可以调用对话框向用户显示消息

      1. 消息框:alert, 常用

         1. alert()方法用于显示带有一条指定消息和一个ok按钮的警告框
         

         /**
         		 * 打开弹出框
         		 */
         		function openAlert() {
         			window.alert("这是弹出框");
         			console.log("。。。");
         		}
         

         2. 输入框:prompt,返回提示框中的值

            1. prompt() 方法用于显示可提示用户进行输入的对话框
            2. 参数(可选)
               1. 第一个参数:要在对话框中显示的纯文本
               2. 第二个参数:默认的输入文本

         /**
         		 * 输入框
         		 */
         		function openpPrompt() {
         			var name = window.prompt("请输入用户名：","");
         			alert("输入的值为：" + name);
         		}
         

         3. 确认框:confirm,返回true/false

            1. confirm()方法用于显示一个带有指定消息和OK及取消按钮的对话框

         /**
         		 * 确认框
         		 */
         		function openCinfirm() {
         			var flag = window.confirm("您确认要删除这条记录吗？");
         			if (flag) {
         				alert("删除成功...");
         			} else {
         				alert("没事儿别瞎点。。。");
         			}
         		}
         

      2. 打开窗口

         1. window.open()方法既可以导航到一个特定的URL也可以用来打开一个新的窗口
            1. _self 在当前窗口显示目标网页
            2. _blank 在新窗口显示目标网页
            3. _parent 框架网页中当前整个窗口位置显示目标网页
            4. _top 框架网页中在上部窗口中显示目标网页

      /*window.open()方法*/
      		function openPage () {
      			//window.open();// 打开新的空白页(新开的)
      			// window.open("http://www.baidu.com");
      			// window.open("http://www.baidu.com",'_self');
      			// window.open("index.html");
      			window.open("01-window对象.html","_self");
      		}
      

      3. 关闭窗口

         1. window.close:关闭窗口
         2. 只能关闭被open打开的窗口

      /**
      		 * 关闭当前页面
      		 */
      		function closePage () {
      			window.close(); // Scripts may close only the windows that were opened by it.
      		} 
      

   2. 时间函数

   		<button onclick="openBaidu()">3秒钟跳转到百度</button>
   		
   		<button onclick="stopPrint()">停止打印</button>
   		
   		<br /><hr /><br />
   		
   		<button onclick="startDate()">开始</button> 
   		<button onclick="stopDate()">暂停</button>
   		<h2 id="mydate">当前时间：</h2>
   

   1. setTimeout( ):在指定的毫秒数后调用函数或计算表达式.通过返回的标识也可以
   	1. cliearTimeout(id)来清楚指定函数的执行
   	2. 在times毫秒后执行function指定的方法,执行之前也可以取消
   

   		function openBaidu(){
   			alert("3秒钟跳转到百度...");
   			setTimeout(function(){
   				// 打开到百度
   				window.open("http://www.baidu.com");
   			},3000);
   		}
   		
   		//var id = setTimeout(test,1000);
   		
   		function test() {
   			console.log("。。。");
   			id = setTimeout(test,1000);
   		}
   		/**
   		 * 停止函数
   		 */
   		function stopPrint() {
   			clearTimeout(id);
   		}
   

   1. setInterval( ):可按照指定的周期(以毫秒计)来调用函数或计算表达式,也可根据返回的标识来结束,该方法会不停地调用函数,知道clearInterval( )被调用或窗口被关闭
   

   /*时间实例*/
   		var dateId;
   		/**
   		 * 开始时间
   		 */
   		function startDate () {
   			dateId = setInterval(getDate,1000);
   		}
   		/**
   		 * 结束时间
   		 */
   		function stopDate() {
   			clearInterval(dateId);
           }
   // 得到系统当前时间
   			var currentDate = new Date();
   			var localDate = currentDate.toLocaleString();
   			console.log(localDate);
            
   

histroy对象

1. history 对象的属性:length,返回浏览器历史列表中的URL数量
2. history对象的方法
  	1. back():加载history列表中的前一个URL
  	2. forward( ):加载历史列表中的下一个URL.当页面第一次访问时,还有没有下一个url.
  	3. go(number|URL):URL参数使用的是要访问的URL,而number参数使用的是要被访问的URL在History的URL列表中的相对位置.go(-1),到上一个页面

location对象

1. location 对象的属性 href:设置或返回完整的URL
2. location 对象的方法
  	1. reload():重新加载当前文档
  	2. replace():用新的文档替换当前文档

// 得到当前的url
		var url = window.location.href;
		console.log(url);
		
		// 跳转到指定页面
		//window.location.href = "03-history对象.html";
		// window.location.href = "http://www.baidu.com";
		
		function reload1() {
			// 刷新页面
			//window.location.reload();
			// 用指定页面替换当前页面
			window.location.replace("http://www.baidu.com");
		}