javascript - 如何在子html文件上替换父div标签中的子html文件?
问题描述
我正在尝试将子 HTML 文件更改为另一个文件,但它不起作用
但我不想使用 iframe。
等等
file1.html(父) div 标签显示 file2.php(子)
现在我想在单击 file2(子)表行时将 file2.php 替换为 file3.php
function callURL(url) {
location.href = url;
}
这将加载新标签。我只想替换 div 标签
解决方案
iframe 的一些替代解决方案是:
AJAX - 您可以使用 XMLHttpRequest 对象检索数据并将其注入您的页面,例如在 div 中。使用 jQuery 的示例:
$( "#result" ).load( "ajax/test.html" );
HTML5 Web Components - HTML Imports 是 Web Components 的一部分,允许将 HTML 文档捆绑到其他 HTML 文档中。这包括 HTML、CSS、JavaScript 或 .html 文件可以包含的任何其他内容。例子:
<link rel="import" href="http://stackoverflow.com">
其他一些想法是:
<object>
标记 - 它定义 HTML 文档中的嵌入对象。可用于 HTML 文件和多媒体内容,如音频、视频、小程序、ActiveX、PDF 和 Flash 或其他插件)。
<object data="http://stackoverflow.com" width="400" height="300" type="text/html">
Alternative Content
</object>
<embed>
标签 - 它为外部应用程序(例如插件)定义了一个容器,也可以被“入侵”并用于显示 HTML 页面。
<embed src="http://stackoverflow.com" width=200 height=200 />
关于传递 HEADER 最好的解决方案是使用 AJAX 方法,这里是一个示例:
$.ajax({
url: "http://stackoverflow.com",
data: { uname: "test" },
type: "GET",
beforeSend: function(xhr){xhr.setRequestHeader('X-TOKEN', 'xxxxx');},
success: function() { alert('Success!' + authHeader); }
});
或以这种方式,
$.ajax({
url: "http://stackoverflow.com",
data: { uname: "test" },
type: "GET",
headers:{ "X-TOKEN": 'xxxxx'},
推荐阅读
- python-3.x - 删除除字典 python3 中提到的所有键之外的所有键
- eclipse - T24 例程 - 编译错误 - 未定义组件。$PACKAGE 是强制性的吗?
- javascript - 更改中心时传单地图变灰
- javascript - 将对象数组值转换为整数值
- go - Golang 和 gqlgen 与 GitHub
- javascript - 如何获取属性列值?
- javascript - 使用 Metro 配置多个变压器/解析器
- reactjs - 类型随时间变化的变量的类型注释
- sql - 使用 count 作为一个表的总数作为另一个表中的 int 字段
- git - Git fetch 在 SSH 模式下工作,但在 jenkins 下的 HTTPS 中失败