iframe

551 阅读2分钟

iframe基本内涵

  • 通常我们使用iframe直接直接在页面嵌套iframe标签指定src就可以了。

    <iframe src="demo_iframe_sandbox.htm"></iframe>
    
  • iframe常用属性:
    1.frameborder:是否显示边框,1(yes),0(no)
    2.height:框架作为一个普通元素的高度,建议在使用css设置。
    3.width:框架作为一个普通元素的宽度,建议使用css设置。
    4.name:框架的名称,window.frames[name]时专用的属性。
    5.scrolling:框架的是否滚动。yes,no,auto。
    6.src:内框架的地址,可以使页面地址,也可以是图片的地址。
    7.srcdoc , 用来替代原来HTML body里面的内容。但是IE不支持, 不过也没什么卵用
    8.sandbox: 对iframe进行一些列限制,IE10+支持
    

优点:

  1. iframe能够原封不动的把嵌入的网页展现出来。
  2. 如果有多个网页引用iframe,那么你只需要修改iframe的内容,就可以实现调用的每一个页面内容的更改,方便快捷。
  3. 网页如果为了统一风格,头部和版本都是一样的,就可以写成一个页面,用iframe来嵌套,可以增加代码的可重用。
  4. 如果遇到加载缓慢的第三方内容如图标和广告,这些问题可以由iframe来解决。
  5. 重载页面时不需要重载整个页面,只需要重载页面中的一个框架页(减少了数据的传输,增加了网页下载速度)
  6. 方便制作导航栏

缺点:

  1. 会产生很多页面,不容易管理
  2. 不容易打印
  3. 浏览器的后退按钮无效
  4. 代码复杂,无法被一些搜索引擎索引到,这一点很关键,现在的搜索引擎爬虫还不能很好的处理iframe中的内容,所以使用iframe会不利于搜索引擎优化。
  5. 多数小型的移动设备(PDA 手机)无法完全显示框架,设备兼容性差
  6. 多框架的页面会增加服务器的http请求,对于大型网站是不可取的。

总结

由于上面诸多缺点,因此不符合标准网页设计的理念,已经被标准网页设计抛弃 提示: 目前框架的所有优点完全可以使用Ajax实现,因此已经没有必要使用框架了