使用 iframe 获取网页片段的一个好处

作者:realazy 来源:realazy 时间:2008-12-01 12:37:00 

异步操作数据的方式有两种常见的方式:XMLHttpRequestiframe. 孰优孰劣在此我们不争论,只是想举一个例子说明在获取网片片段上,使用 iframe 有一个比 XMLHttpRequest 更易企及的好处。

Ajax 常见的一种使用方法是加载网页片段填充某个区域。假设我们要在网页 foo.com/index 上请求 foo.com/partial。我们假设 partial 就是 HTML,不涉及 JSON 或 XML 格式。在这种情况下:

  1. 使用 XMLHttpRequest 直接访问 partial,获取 responseText 后赋予 index 页面上某个元素的 innerHTML 即可完成。partial 必须是一个纯粹的 HTML 片段(基于以上假设)。

  2. 在页面上创建一个隐藏的 iframe, 使用 iframe 的 src 请求 partial, partial 可以作为一个完整的页面,里面包含 JavaScript,由 partial 里的 JS 完成替换 index 上页面片段替换。

第二种看起来更繁琐,但能给我们更多控制权。例如,假如用户直接访问 foo.com/partial(这种情况很容易发生,假设您是 unobtrusive 的拥护者,机会更大,例如需要点击网页上的链接更新某部分内容时,用户使用新窗口打开了改链接), 你希望她看到的是什么内容呢?

在第一种情况中,用户看到的是代码片段,绝大部分下没有任何样式,也没有任何额外提示,导致用户体验的下降。因为只是一个 HTML 片段,你什么事都干不了。

但在第二种情况下,用户看到内容可能也只是 HTML 片段,但这却是一个完整的页面,一个可以执行 JS 的完整页面。我们只需检查这个页面的 parent 对象有没有我们预设的值,就可以判断它是不是在 iframe 之内了,然后我们可以让它跳转到正常的页面。

Demo: http://realazy.org/lab/xhrvsiframe/

标签:iframe,XMLHttpRequest,框架,ajax
0
投稿

猜你喜欢

  • Golang使用ini库读取配置详情

    2023-07-02 07:46:56
  • python PIL和CV对 图片的读取,显示,裁剪,保存实现方法

    2022-02-06 09:35:07
  • mysql学习笔记之帮助文档

    2024-01-19 08:14:36
  • 在keras下实现多个模型的融合方式

    2023-06-03 17:14:59
  • Thinkphp5.1获取项目根目录以及子目录路径的方法实例讲解

    2023-11-20 00:55:58
  • Git文件常用操作总结及拓展

    2023-02-04 08:13:18
  • 又一个仿alert提示效果

    2007-12-24 17:34:00
  • python协程与 asyncio 库详情

    2023-08-23 12:08:36
  • Mootools 1.2教程(22)——同时进行多个形变动画

    2008-12-29 14:11:00
  • 如何使用Vue3设计实现一个Model组件浅析

    2024-04-27 15:57:19
  • 浅谈MySQL之select优化方案

    2024-01-27 03:32:38
  • 深入了解SQL Server 2008 商业智能平台

    2009-01-15 13:03:00
  • Python3 模块、包调用&路径详解

    2021-06-04 06:03:08
  • 详解pygame捕获键盘事件的两种方式

    2021-02-27 08:51:54
  • pyhanlp安装介绍和简单应用

    2022-04-10 14:22:13
  • Pygame实战之实现经典外星人游戏

    2021-05-10 00:31:44
  • 使用Python中Tkinter模块的Treeview 组件显示ini文件操作

    2022-05-23 03:45:38
  • 浏览器 cookie 限制

    2008-05-23 13:09:00
  • Go语言 go程释放操作(退出/销毁)

    2023-09-17 22:03:42
  • Python手拉手教你爬取贝壳房源数据的实战教程

    2023-07-10 12:58:36
  • asp之家 网络编程 m.aspxhome.com