页面信息加载方法和装置的制造方法_2

文档序号:9579292阅读:来源:国知局
步骤以表单元素为例,说明扫描过程。
[0042]在HTML5提供的LocalStorage本地存储中,为每个域名提供5M的独立存储空间,可以用通用资源标识符URI (Uniform Resource Identifier)作为页面ID来标识页面,URI是该页面的URL去掉网站域名后的剩余部分。
[0043]页面的ID用于在该页面所属域名的存储空间中确定与该页面对应的存储内容。当然,也可以使用页面的URL,页面标题等作为页面的标识,页面的URL和页面标题可从页面相应的标签中获取。
[0044]由于LocalStorage本地存储机制本身保证了不同域名具有不同的存储空间,贝IjURL中的域名部分可以省略。因此,优选地,本发明中以页面的URI作为页面ID。
[0045]扫描页面中的一个或多个表单元素包括获取页面中指定表单元素对应的数据。具体地,可以设置一个规则来扫描,例如,指定一个标签集合,包括input, select, textarea等标签,其中input标签对应页面中的输入域,select标签对应于选择列表,textarea标签对应于文本域。然后通过getElementByTagName函数来返回带有指定类型的表单元素的数据。
[0046]或者,给页面中所有要扫描的表单元素添加一个类别属性Class = “Scan”,使用getElementByClassName (Scan)方法获取所有属性为Scan的表单兀素。
[0047]可选地,该步骤中还可以包括:在监听到页面离开事件时,获取页面离开事件的发生时刻作为第一时间戳。
[0048]步骤S240,为每个表单元素生成表单元素标识符。
[0049]表单元素标识符至少包含页面的页面ID和表单元素的名称。表单元素标识符可以是页面ID和表单元素名称的组合,例如,页面ID为a2,表单元素为两个文本域,名称分别为name, phonenumber等,则表单兀素的标识符可以分别为a2.name, a2.phonenumber等。类似地,也可以采用页面URL,结合表单的其他属性生成表单元素标识符,表单元素标识符应能够在为该域名提供的存储空间中唯一地确定页面及表单元素。
[0050]步骤S250,将每个表单元素标识符与对应的表单元素的数据相关联地保存在本地存储中。
[0051]具体地,对于LocalStorage本地存储,将表单元素标识符与对应的表单元素的数据以键值对形式保存在本地存储中,其中,表单元素标识符作为键值名,表单元素的数据作为键值。表单元素名称和表单元素的数据可能包括文字,整数,浮点数等,LocalStorage中,通常以字符串形式保存信息,则在将表单元素的数据保存在本次存储之前,还包括将表单元素名称和表单元素数据中的非字符串的内容转化为字符串。
[0052]可选地,该步骤还包括:将步骤S230中获取的第一时间戳与页面ID等页面表示信息相关联保存在本地存储中。与表单元素的保存方式类似地,在LocalStorage中第一时间戳也以键值对的形式存储,例如,以页面的ID作为键值名,时间戳作为键值。
[0053]LocalStorage本地存储中包含多个存储子空间,每个存储子空间与网站域名绑定;则该步骤中将每个表单元素标识符与对应的表单元素的数据相关联地保存在本地存储中进一步包括:根据页面的URL确定页面对应的网站域名;将页面中的输入信息保存在与网站域名绑定的存储子空间中。页面只能访问所述域名对应的存储子空间,这保证了用户数据的安全性。
[0054]将表单元素标识符与对应的表单元素的数据相关联地保存在本地存储中时,本地存储中可能已保存有用户之前在该页面中输入的表单数据,则该步骤具体为:根据页面的URL获取URI,作为页面的ID,与表单元素名称组合,进一步得到表单元素标识符,在LocalStorage中找到键值名为该标识符的键值对,利用本次表单元素的数据对已有键值进行更新。例如,通过1calStorage.setitem(key, value)方法对键值更新。
[0055]步骤S260,再次加载页面时,在本地存储中查找包含页面的页面ID的一个或多个表单元素标识符。
[0056]具体地,对应于步骤S230,该步骤可以包括:再次加载页面时,获取页面的ID,如页面URL、页面标题或URI等,例如,页面ID为a2,根据页面的URL等信息确定页面所述的域名,在与该域名绑定的存储子空间中查找键值名包含a2的键值对,例如,键值名为a2.name, a2.phonenumber 的键值对。
[0057]可选地,在查找包含页面的页面ID的一个或多个表单元素标识符之前,该步骤还包括:获取再次加载页面的开始时刻作为第二时间戳;
[0058]从本地存储中读取第一时间戳,计算第一时间戳和第二时间戳的差值,将第一时间戳与第二时间戳的差值与预设的时间阈值进行比较。
[0059]通过第一时间戳,第二时间戳和预设的时间阈值为页面输入信息的自动填写设置一个过期时间。当第一时间戳和第二时间戳的差值小于预设的时间阈值时,执行后续输入信息填写的步骤;若差值超过预设的时间,则不执行信息填写。
[0060]这在一些情况下是有利的,例如,对于注册页面,用户在一段较长时间后重新打开该页面,其目的一般为重新注册新的账号,输入信息与上次不同,则本地存储中的页面输入信息不必填写。具体地,预设的时间阈值可根据页面类型设定,例如,对于搜索页面,输入变化频繁,则预设时间间隔较短,对于登录页面,输入单一,预设时间间隔较长。
[0061]步骤S270,按照每个表单元素标识符所包含的表单元素的名称,将每个表单元素标识符对应的表单元素的数据填写到与表单元素的名称相匹配的页面的表单元素中。
[0062]具体地,该步骤可以为:根据步骤S260中查找到的表单元素标识符,获得标识符中的表单名称,例如,对于表单元素标识符a2.name,其表单元素名称为name ;在页面中查找名称为name的表单元素,如果查找成功,将对应的表单数据填写在名称为name的表单元素中。
[0063]下面以一个具体示例说明本发明实施例的过程。
[0064]用户首次访问一注册页面,页面的URI为/reg.html,域名为360,注册页面中包括用户名输入框和密码框,其中,用户名输入框在页面中对应输入元素:〈input type =〃teXt〃name = 〃uSer〃/>,该输入元素为一文本域表单元素,名称为“user”密码框对应输入元素〈input type = "password"〉。页面加载时,本发明中的页面逻辑按照预设的查找、存储规则,在LocalStorage本地存储中的与域名360对应的空间中查找键值对,例如,查找名称为reg.html.user的键值对,由于用户首次访问该页面,因此,查找不到。
[0065]用户输入用户名,例如,test_reg,以及密码后,点击按钮,页面跳转,这时,按照预定的扫描规则扫描页面中的输入元素,例如,扫描规则为扫描除属性为password以外的全部input标签,为用户名对应的输入元素生成标识符reg.html.user,将标识符作为键值名,test_reg作为键值进行存储。
[0066]若用户注册失败,回退至注册页面时,页面逻辑在本地存储中查找名称为reg.html.user的键值对,查找成功,将该键值对的键值test_reg填写到对应的用户名输入框中。
[0067]根据本发明上述实施例提供的方法,在监听到页面离开时,扫描页面中的表单元素并将表单元素,以键值对的方式将表单数据存储在HTML5提供的LocalStorage中,实现了页面信息的本地永久化的存储;重新加载页面时,将LocalStorage中与该页面对应的输入信息填写到页面中。根据该方案,重新加载信息输入页面时,自动加载输入内容,避免了用户的重复操作,节省了时间,并且输入内容的填写在本地完成,不需要和服务器交互。
[0068]图3示出了根据本发明一个实施例的页面信息加载装置的结构框图,如图3所示,装置包括:
[0069]查找模块310,适于在页面加载时,按预设的查找规则在本地存储中查找与页面输入元素对应的输入信息.
[0070]填写模块320,适于将查找到的与页面输入元素对应的输入信息填写到页面输入元素中;
[0071]监听模块330,适于在页面加载完成后,监听页面离开事件;
[0072]页面离开事件包括但不限于:关闭浏览器窗口,通过地址栏或收藏夹跳转至其他页面,点击浏览器上的返回,前进,主页按钮时的页面跳转,点击页面中的URL链接导致的页面跳转,以及触发提交按钮,如页面中的HTML标签〈input type = “submit”〉等。
[0073]还包括:与页面跳转有关的Javascript函数被触发时导致的页面离开,例如,Javascript为Locat1n, href重新赋值,导致浏览器标签页跳转;以及用户点击F5或浏览器刷新按钮后,页面调用Javascript刷新方法,如Locat1n, replace, Locat1n, reload等进行页面刷新。
[0074]扫描模块340,适于根据页面离开事件,扫描页面中的输入元素,根据页面特征和输入元素的特征将输入元素的输入信息保存在本地存储中。
[0075]页面中的输入元素包括表单元素,例如,搜索框,输入框,以及用户对单选框,复选框,下拉列表等的表单元素的选择状态等。则扫描模块330进一步适于:扫描页面中的一个或多个表单元素。
[0076]具体地,扫描模块340扫描页面中的一个或多个表单元素包括获取页面中每个表单元素对应的数据。具体地,可以设置一个规则来扫描,例如,指定一个标签集合,
当前第2页1 2 3 4 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1