




版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
项目5.1使用Location对象、navigator对象、screen对象主讲:***2024年1月2日JavaScript动态网页设计1子项目项目5BOM对象和事件表单常用元素2024年1月2日JavaScript动态网页设计2学习任务
任务1使用Windows对象
任务2使用document对象
任务6
History对象
任务3使用Location对象
任务4使用navigator对象
任务5使用screen对象项目5BOM对象和事件项目5BOM对象和事件任务3使用Location对象window.location对象用于获得当前页面的地址(URL),并把浏览器重定向到新的页面。window.location
对象在编写时可不使用window这个前缀。Location对象包含有关当前URL的信息。Location对象是window对象的一部分,可通过window.Location属性对其进行访问。注意:没有应用于Location对象的公开标准,不过所有浏览器都支持该对象。项目5BOM对象和事件1、Location对象属性:属性描述hash返回一个URL的锚部分host返回一个URL的主机名和端口hostname返回URL的主机名href返回完整的URLpathname返回的URL路径名。port返回一个URL服务器使用的端口号protocol返回一个URL协议search返回一个URL的查询部分项目5BOM对象和事件范例5-5返回(当前页面的)整个URL:
<scripttype="text/javascript">document.write(location.href);</script>file:///C:/范例5-5.html以上代码输出为:1.1href属性的使用项目5BOM对象和事件WindowLocationPathnamelocation.pathname属性返回URL的路径名。返回当前URL的路径名:<script>document.write(location.pathname);</script>/js/js_window_location.asp以上代码输出为:1.2pathname属性的使用项目5BOM对象和事件<html><head><script>functionnewDoc(){window.location.assign("")}</script></head><body><inputtype="button"value="加载新文档"onclick="newDoc()"></body></html>1.3assign加载新的文档范例5-6加载一个新的文档:运行结果:项目5BOM对象和事件任务4使用navigator对象在进行Web开发时,通过navigator对象的属性来确定用户浏览器的版本,进而编写有针对某一浏览器版本的代码。因为当前流行着几大浏览器,并且各浏览器对W3C的Web规范的实现都有区别,在编程时有必要识别不同的浏览器。navigator的常用属性如下:appCodeNam,浏览器的代码名称。appName,浏览器的实际名称。appVersion,浏览器的版本号和平台信息。这些都是在Web开发中经常用到的属性。例如,XMLHttpRequest对象创建方式,在IE浏览器中和其他浏览器是不同的,因此需要通过读取navigator对象的appName属性来确定是不是在IE中。window.navigator对象包含有关访问者浏览器的信息。WindowNavigatorwindow.navigator对象在编写时可不使用window这个前缀。项目5BOM对象和事件1、navigation对象的属性属性说明appCodeName返回浏览器的代码名appName返回浏览器的名称appVersion返回浏览器的平台和版本信息cookieEnabled返回指明浏览器中是否启用cookie的布尔值platform返回运行浏览器的操作系统平台userAgent返回由客户机发送服务器的user-agent头部的值项目5BOM对象和事件2、navigation对象的方法方法描述javaEnabled()指定是否在浏览器中启用JavataintEnabled()规定浏览器是否启用数据污点(datatainting)项目5BOM对象和事件范例5-7使用navigation对象,输出当前浏览器的信息
<divid="example"></div>
<script>
txt="<p>BrowserCodeName:"+navigator.appCodeName+"</p>";txt+="<p>BrowserName:"+navigator.appName+"</p>";txt+="<p>BrowserVersion:"+navigator.appVersion+"</p>";txt+="<p>CookiesEnabled:"+navigator.cookieEnabled+"</p>";txt+="<p>Platform:"+navigator.platform+"</p>";txt+="<p>User-agentheader:"+navigator.userAgent+"</p>";txt+="<p>User-agentlanguage:"+navigator.systemLanguage+"</p>";
document.getElementById("example").innerHTML=txt;
</script>项目5BOM对象和事件运行结果如下所示:项目5BOM对象和事件任务5使用screen对象window.screen
对象在编写时可以不使用window这个前缀。项目5BOM对象和事件1、Screen对象的属性:属性说明availHeight返回屏幕的高度(不包括Windows任务栏)availWidth返回屏幕的宽度(不包括Windows任务栏)colorDepth返回目标设备或缓冲器上的调色板的比特深度height返回屏幕的总高度pixelDepth返回屏幕的颜色分辨率(每象素的位数)width返回屏幕的总宽度项目5BOM对象和事件范例5-8返回您的屏幕的可用宽度:
<html><head><script>document.write("可用宽度:"+screen.availWidth);</script></head><body></body></html>运行结果项目5BOM对象和事件任务5History对象History对象包含用户(在浏览器窗口中)访问过的URL。History对象是window对象的一部分,可通过window.history属性对其进行访问。注意:没有应用于History对象的公开标准,不过所有浏览器都支持该对象。项目5BOM对象和事件1、History对象属性属性说明length返回历史列表中的网址数2、History对象方法方法说明back()加载history列表中的前一个URLforward()加载history列表中的下一个URLgo()加载
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 多方投资担保合同
- 建筑工程分包合同5篇
- 赔偿协议书的格式年
- 公路交通工程与道路养护作业指导书
- 煤炭进口合同6篇
- 针织横机电控产业分析报告
- 南瓜收购合同范本
- 养殖用电合同范本
- 卖窑洞合同范本
- 一般经济购买合同范本
- (人教PEP2024版)英语一年级上册Unit 4 教学课件(新教材)
- 2024年重庆市中考英语试卷(AB合卷)附答案
- 中医基础理论(一)
- 新人教版二年级数学下册期末考试卷及答案【1套】
- 2024至2030年全球及中国电竞游戏外设行业深度研究报告
- 家具公司合伙协议
- DL5000-火力发电厂设计技术规程
- 《医德医风学习记录》
- 羊水穿刺的委托书
- 爆破飞石控制措施
- 2024年新疆生产建设兵团兴新职业技术学院单招职业适应性测试题库必考题
评论
0/150
提交评论