IE8 WebSlice

默认情况下,IE8对feed和WebSlice的更新频率是24小时。 WebSlice里的脚本不会被执行,form里的字段也不会起作用。 WebSlice的更新时会和本地的WebSlice进行对比,如果有不同,Favorites Bar里的WebSlice按钮字体会加粗。

概述

WebSlices是一种浏览器技术,只要html中使用一些特殊的标记,就可以使用户只订阅页面的一部分变得可能。这种订阅就像是订阅RSS一样。而这些特殊的标记里包括了订阅过期的描述,IE8会定时去检查更新,并给订阅用户提示。

上图是ebay为IE8用户提供的一个应用。在这个应用里,用户可以在搜索结果里订阅某一个商品的拍卖信息。订阅后IE8的Favorite Bar里便多了一个WebSlice按钮。当拍卖信息发生变化(比如说是有人出了更高的价钱),该WebSlice按钮会闪动,点击后便如上图一样展开,显示新的拍卖信息。本篇文章是依据Internet Explorer 8 Beta 1 Whitepapers WebSlices 编写的。大家可以直接参考。

WebSlices的界面

用户在整个WebSlices的使用过程中有四个步骤

  • 发现
  • 订阅
  • 提示
  • 预览

发现

当IE8发现页面中存在WebSlices时,Tool Bar中会出现一个紫色的发现按钮,点击展开可以看到此页面的所有Feed(包括Rss之类的)。

而当鼠标悬浮在使用了特殊标记的那部分html上时,左上角也会浮出这个即处(in-place)发现按钮。

订阅

点击紫色的发现按钮就可以完成订阅,订阅后,Favorite Bar里就会出现对应的WebSlice按钮。(刚安装IE8的时候,我选择了使用原先IE7的设置,却发现多了一个Favorite Bar,当时还奇怪呢。原来ms是有这个用意的。)

提示

订阅信息发生变化,该WebSlice按钮会闪动提示.

预览

点开Favorite Bar里的WebSlice按钮就可以预览订阅的信息。(其实就是用个小窗口看html)

编写WebSlices

为了方便,我使用css选择器来描述标记。

必要标记

先看一个示例,在http://auction.microsoft.com/item这个页面里有这么一段html,

< div  class ="hslice"  id ="1" >
    
< class ="entry-title" > Item - $66.00 </ p >
    
< div  class ="entry-content" > high bidder: buyer1 …  </ div >
</ div >


如同rss里item的title,description,link,这里的title就是"Item - $66.00",description就是"high bidder: buyer1 … ",link就是http://auction.microsoft.com/item#1。具体解释一下:

hslice : ".hslice[id]"这是一个唤醒标记,没有它,其他标记都不起作用。标class以hslice的元素必须要有id,并通过页面的url和这个id来合成link,在用户点击WebSlice下方的open web page按钮时,会新开link指定的url的页面

entry-title : ".hslice[id] .entry-title"的标签的innerHTML会作为title的一部分。可以有不止一个class="entry-title"的元素

entry-content : ".hslice[id] .entry-content"的标签的innerHTML会作为description的一部分。可以有不止一个class="entry-title"的元素也就是说,IE8会把这些标记理解成rss类似的feeds,而网站开发人员可以不用分别维护feeds和原页面。

不过WebSlices不会基于"类似rss"这么模糊的定义,WebSlices是基于hAtom Microformat标准的。除了entry-title,entry-content,hslice这三个必需的标记以外以外,还有一些其他的标记,但都是可选的。比如:

可选标记

过期

< div  class ="hslice"  id ="1" >  
    
< class ="entry-title" > Item - $66.00 </ p >  
    
< div  class ="entry-content" > high bidder: buyer1 … 
        
< p > End time: < abbr  class ="endtime"  title ="2008-02-28T17:00:00" > 1 day 18 hours </ abbr ></ p >  
    
</ div >  
</ div >

这里唤醒标记是".hslice[id] .endtime",有意义的值的是title属性的值,而格式使用的是abbr-design-pattern。设置这个标记的意义是,当接近过期的时候(比如说5分钟前),Favorite Bar里的WebSlice按钮会闪动。而真的过期了,WebSlice按钮上的文字就会变灰了。

带宽

< div  class ="hslice"  id ="1" >  
    
< class ="entry-title" > Item - $66.00 </ p >  
    
< div  class ="entry-content" > high bidder: buyer1 … 
        
< p > This clip updates every  < span  class ="ttl" > 15 </ span >  minutes  </ p >  
    
</ div >  
</ div >

带宽是ms给的说法,事实上它的意义和rss里的ttl(Time-to-Live)值的意义是一样的,使用的标记也是".hslice[id] .ttl",表示浏览器检查的时间间隔是多少。

feed url

也许订阅信息和页面上使用的是不同的html,那么IE8还是允许用户使用旧式的feed方式来订阅的。只要feed符合一些要求,还是可以获得一样的WebSlice功能。 feed url的标记是'.hslice[id] [rel="feedurl"]',有意义的是ref属性的值。

< div  class ="hslice"  id ="1" >  
    
< class ="entry-title" > Item - $66.00 </ p >  
    
< div  class ="entry-content" > high bidder: buyer1 … 
        
< rel ="feedurl" ref ="auction.microsoft.com/item.xml" > Subscribe to WebSlice </ a >  
    
</ div >  
</ div >

feed的示例.

<? xml version="1.0" ?>
< rss  version ="2.0" xmlns:mon ="http://www.microsoft.com/schemas/rss/monitoring/2007" >
  
< channel >
    
< title > Feed for Item </ title >
    
< link > http://auction.microsoft.com </ link >
    
< description > Feed for auction item </ description >
    
< ttl > 15 </ ttl >
    
< item >
      
< title > Item = $66.00 </ title >
      
< link > http://auction.microsoft.com/item#1 </ link >
      
< description > high bidder: buyer1 … </ description >
      
< mon:endtime > 2008-02-28T17:00:00 </ mon:endtime >
    
</ item >
  
</ channel >
</ rss >


值得一提的是,这个feed里只允许有一个item。而如果提供了feedurl,就以feed为准了,页面里的其他标记(title description link)不再起作用。

认证

WebSlices的认证和html类似,cookie和http认证。

cookie

cookie可以把认证信息持久化,不过在vista Protected Mode的IE8下, users must run Internet Explorer 8 Beta 1 for Developers in elevated mode (right-click the Internet Explorer 8 icon and select Run as administrator) in order to get the authenticated WebSlice content.

http认证

 

WebSlice supportHTTPHTTPS
HTTP BASIC authXO
HTTP DIGEST authOO

 

如果页面是http的,那么是不能订阅https的WebSlice(例如<a rel="feedurl" href="https://....">)的。还有一个我试验过程中碰到的一个问题,我在一个本地的html文件里加上足够的标记(windows认证),IE8却不能发现WebSlice,如果是http认证的html,是可以正常发现的。但是如果我在一个本地的html文件里如果包含feedurl,也是可以正常发现的。

发现机制

经过前面的介绍,大家应该了解WebSlice是如何被发现的了。但是除了之前的介绍以外,我们还可以为页面制定一个主WebSlice. 或是让即处发现按钮不会浮出(也许有人讨厌这个,比如影响他们自己定制的一些效果),或是用js来下达订阅命令。

主WebSlice

在ToolBar里的发现按钮是个(split button),展开可以看到页面里所有的WebSlice,而如果指定了主WebSlice以后,直接点发现按钮就可以了,不需要从展开的split button找出来再点。指定主WebSlice的代码 

< head >  
    
< link  rel ="default-slice"  type ="application/x-hatom"  href ="www.example.com/#auction"   />  
</ head >

rel type href这三个属性都是必须的。ref,type的值就是"default-slice","application/x-hatom",这段代码的页面的地址是www.example.com,它指定的主WebSlice是"#auction.hslice"选出的。

禁用即处发现按钮

< head >  
    
< meta  name ="slice"  scheme ="IE"  content ="off"   />  
</ head >

 

使用js订阅WebSlice

js里订阅和原来添加到收藏的函数一样addToFavoritesBar。

window.external.addToFavoritesBar(string URL, string Title, [optional] string Type)

唯一值得一提的是最后的参数string Type,如果订阅的是WebSlice的话,Type必须为"slice",然后弹出的就不是addToFavoritesBar的确认框,而是添加WebSlice的确认框。

刷新WebSlice的发现

当浏览器解析完html以后,会在WebSlice发现按钮的split button里列出所有的feed和WebSlice,不过当dom发生变化,被列出的feed和WebSlice是不会同步更新的,使用

window.external.contentDiscoveryReset()

手动更新。在ajax的页面里,回调的最后不要忘了这句。

其他

默认情况下,IE8对feed和WebSlice的更新频率是24小时。 WebSlice里的脚本不会被执行,form里的字段也不会起作用。 WebSlice的更新时会和本地的WebSlice进行对比,如果有不同,Favorites Bar里的WebSlice按钮字体会加粗。

来自:http://www.cnblogs.com/huazhihao/archive/2008/03/09/1097920.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值