JavaScript - The Definitive Guide Read Log 6

Chapter 14. Scripting Browser Windows

Timers

JS本身没有提供任何有关任务调度的方法,但client-side JavaScript提供了几个全局函数(定时器)
setTimeout() 对象在一定时间后执行
clearTimeout() 取消上面的计划任务
setInterval() 同上,但是重复执行
clearInterval() 同上

Browser Location and History

window(或frame)的location属性保存了当前页面的Location对象,通过它可以轻松地得到协议、域名、参数等一系列信息。如果给它赋一个相对路径,那么它会跳至新的页面。这种跳转方式简单且会在历史记录中出现,所以很多人都在使用。另外,需要把location和document.location区分开,location.herf == document.location == document.URL。

有些网站外链分析就用这个做的(猜测)


Obtaining Window, Screen, and Browser Information

获取窗口在屏幕中的位置相对容易,它只是几个只读属性而已。
navigator属性貌似非常有用,因为它保存了很多浏览器相关信息,比如版本号,User-agent,操作系统、是否开启cookie等。

Opening and Manipulating Windows

弹窗已被人认为是流氓行为,使用方法非常简单windows.open。
滚动的方式倒是很多,除了常规的scrollBy()/scrollTo(),还可以使用html中的<a>标记。

Simple Dialog Boxes

目前定义了三种显示对话框的方式:alert(), prompt(), confirm()。

Script the Status Line

最新的浏览器已经没有Status Line了。

Multiple Windows and frame

虽然现代的web设计已经否决了<frame>,但是<iframe>仍在使用。使用frame的优点是,在一个页面刷新时,其它frame可以保持不动,这样用户体验会比较好。
frame和父窗口之间的关系是普通的树型结构,frame[],parent,self和top可以很容易的定位所处的位置。虽然它们可以互相访问,但它们的运行环境并不是一起. 比如,当你调用silde frame中的函数时,那么它的执行环境仍然是自己的runtime context。


Chapter 15. Script Document

Document object是全局空间中的document,它有很多属性。比如write(),它会消除原先显示的内容。它通常用于更新其它frame显示的内容。
document.write()支持多个参数,它们都是要显示的内容。
其它document的属性(legacy)
———————————————————————————————————————————————————————————
bgColor 等同<body>的bgcolor属性
cookie ——
domain (后面解释)
lastModifed ——
title 标题,
URL 类似window中的herf
anchors[]
forms[]
images[]
links[]
———————————————————————————————————————————————————————————
当浏览器显示处理完HTML后,整个页面被组织成DOM,这样就非常利于JavaScript处理里面的内容。另外,可以给标签的name属性复制,那么就可以直接在document使用它了(要注意,不要与已存在的命名冲突)。
我们还注意到,标签还有Event Handlers,但对于JavaScript来说,依次类推即可。

Overview of the W3C DOM

DOM tree是由很多node组成的,所以一开始就介绍了这些node的访问和管理:childNodes, firstChild, lastChild, nextSibling, previousSibling, 和parentNode; appendChild(), removeChild(), replaceChild(), 和insertBefore()调整节点。
———————————————————————————————————————————————————————————
Common node types
Interface nodeType constant nodeType value

Element Node.ELEMENT_NODE
Text Node.TEXT_NODE
Document Node.DOCUMENT_NODE 9
Comment Node.COMMENT_NODE 8
DocumentFragment Node.DOCUMENT_FRAGMENT_NODE 11
Attr Node.ATTRIBUTE_NODE
———————————————————————————————————————————————————————————
通常,我们直接找到某个固定的结点后,就已经知道它是什么类型了。

Finding Element in a document

前面提到的几个遍历的方法,只有在对DOM结构非常了解的情况下才能使用。现在介绍几个更为常用的方法。
document.getElementsByTagName() 用它可以通过标记名字查找,比如body, div等。它返回的是一个数组。
document.getElementById() 如果需要更精确的查找,可能使用标签指定的ID。
document.getElementsByName() 它可以作为第一个的二次筛选,比如<a name="top">,它可以用"top"这个Name进行查找. HTML规定name可以多次使用,所以它返回也是数组。

Modifying a Document

获得对象 一个重要的原因是为了修改它。JS为我们提供了相当数据的Modifying函数,即可以修改据内容,又可以修改数据属性。并且增加和删除元素也是可以的。具体使用参见相关文档或示例。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值