登录
首页 >  文章 >  前端

指定框架源文件路径,_FRAME标签SRC设置方法

时间:2026-05-30 11:13:09 330浏览 收藏

本文深入解析了已废弃的 `` 和 `

怎样指定框架源文件路径_FRAME标签的SRC属性设置

src 属性在 标签中直接决定该框架加载哪个 HTML 文件,但必须配合 使用,且现代浏览器已弃用该整套机制。

为什么 src 设置后页面不显示或报错

常见现象是空白、404、或控制台提示 “Refused to display 'xxx' in a frame because it set 'X-Frame-Options' to 'deny'”。根本原因有三个:

  • 必须嵌套在 内,不能放在 里——否则被忽略或触发 quirks mode
  • 路径写错:相对路径以 所在 HTML 文件为基准,不是当前工作目录或浏览器地址栏路径
  • 目标文件启用了 X-Frame-Options: denyContent-Security-Policy: frame-ancestors 'none',禁止被嵌入(如 google.com、github.com)

src 支持的路径类型和实际写法

绝对 URL 和相对 URL 都可工作,但要注意协议显式声明和路径解析逻辑:

  • 绝对 URL 必须带协议:写 src="https://example.com/page.html",不能只写 src="www.example.com/page.html"(会被当成相对路径)
  • 同站相对路径最稳妥:假设 index.html(含 )和 nav.html 在同一目录,就写 src="nav.html"
  • 子目录需补全:若 frames/ 下有 main.html,则写 src="frames/main.html",不是 src="/frames/main.html"(开头的 / 表示根目录,容易错位)
  • 不支持 file:// 协议跨文件访问(Chrome/Firefox 默认阻止),本地双击打开会失败,必须起本地服务器

用 JavaScript 动态修改 frame.src 的限制

可以通过 document.getElementById('myFrame').src = 'new.html' 修改,但有两个硬性前提:

  • 目标 必须有 idname 属性,否则无法可靠获取元素
  • 修改只能作用于同源页面(即协议+域名+端口完全一致),跨域会触发安全错误,且无法读取 contentDocument
  • 注意 DOM 加载时机:脚本必须在 解析完成后再执行,否则 getElementById 返回 null;推荐放在 后、或用 window.onload

替代方案比死磕 更现实

已被 HTML5 正式移除,所有新项目应改用