第十二章JavaScript操作BOM对象

2301_旺仔

已于 2023-11-09 16:47:56 修改

阅读量43

点赞数

分类专栏：前端文章标签：前端 java

于 2023-11-09 15:15:13 首次发布

本文链接：https://blog.csdn.net/2301_77058215/article/details/134312536

版权

前端专栏收录该内容

14 篇文章 0 订阅

订阅专栏

核心对象window
window对象的常用属性
history：有关客户访问过的URL的信息
location：有关当前 URL 的信息
语法
window.属性名= "属性值"
window.location="http://www.baidu.com" ;表示跳转到百度首页
window对象的常用方法
prompt( ) 显示可提示用户输入的对话框两个参数，输入对话框，用来提示用户输入一些信息，单击“取消”按钮则返回null，单击“确定”按钮则返回用户输入的值，
alert( ) 一个参数，仅显示警告对话框的消息，无返回值，不能对脚本产生任何改变
confirm( ) 将弹出一个确认对话框一个参数，确认对话框，

显示提示对话框的消息、“确定”按钮和“取消”按钮，单击“确定”按钮返回true，单击“取消”按钮返回false，因此与if-else语句搭配使用

<script type="text/javascript">
   var flag=confirm("确认要删除此条信息吗？");
    if(flag==true)
	      alert("删除成功！");
      else
	       alert("你取消了删除");
</script>

close( ) 关闭浏览器窗口
open( ) 打开一个新的浏览器窗口，加载给定 URL 所指定的文档
setTimeout( ) 在指定的毫秒数后调用函数或计算表达式
setInterval( ) 按照指定的周期（以毫秒计）来调用函数或表达式

open()方法
window.open("弹出窗口的url","窗口名称","窗口特征”)
窗口特征
history对象
back() 上一个
history.back()==history.go(-1)后退
history.forward()==history.go(1) 前进
forward() 下一个
go() 具体
location对象
常用属性
host：设置或返回主机名和当前URL的端口号
hostname：设置或返回当前URL的主机名
href：设置或返回完整的URL
常用方法
reload()：重新加载当前文档
replace()：用新的文档替换当前文档
location和history对象的应用
主页面使用href实现跳转和刷新本页

<a href="javascript:location.href='flower.html'">查看鲜花详情</a>  
<a href="javascript:location.reload()">刷新本页</a>
<a href="javascript:history.back()">返回主页面</a>

Document对象
referrer：返回载入当前文档的URL
URL：返回当前文档的URL

Document对象应用

判断页面是否是链接进入
自动跳转到登录页面

var preUrl=document.referrer;  //载入本页面文档的地址
if(preUrl==""){	
      document.write("<h2>您不是从领奖页面进入，5秒后将自动 
                         跳转到登录页面</h2>");
      setTimeout("javascript:location.href='login.html'",5000);
}

~的常用方法

document.getElementById("book").innerHTML="现象级全球畅销书";

等号在innerHTML前面是获取该book内容，在后面给book重新定义

JavaScript内置对象
Array：用于在单独的变量名中存储一系列的值
String：用于支持对字符串的处理
Math：用于执行常用的数学任务，它包含了若干个数字常量和函数
Date：用于操作日期和时间

Date语法

var 日期对象=new Date(参数)
参数格式：MM DD,YYYY,hh:mm:ss

var  today=new Date();   //返回当前日期和时间
var tdate=new Date("september 1,2013,14:58:12");

实例

function disptime(){
var today = new Date();  
var hh = today.getHours(); 
var mm = today.getMinutes();
var ss = today.getSeconds();
document.getElementById("myclock").innerHTML="现在是:"+hh +":"+mm+": "+ss;
}
disptime();

Math对象

如何实现返回的整数范围为2~99？
var iNum=Math.floor(Math.random()*98+2);
实例
随机选择颜色

function selColor(){
        var color=Array("红色","黄色","蓝色","绿色","橙色","青色","紫色");
        var num=Math.ceil(Math.random()*7)-1;
        document.getElementById("color").innerHTML=color[num];
}