TurboLinks 如何显示响应 HTML?
How does TurboLinks display response HTML?
我目前正在研究 JavaScript TurboLinks 框架的基本内部 功能。据我了解,onclick 事件被分配给所有锚标记,以便能够防止默认操作(整页重新加载)并通过 AJAX 加载 link 内容。此处如有错误请指正
当 AJAX 回调接收整个 HTML 文档作为字符串时,如何在不(重新)加载脚本和样式标签的情况下呈现它?
脚本和样式只有在插入页面时才会被(重新)加载和评估。当通过 AJAX 收到 HTML 时,Turbolinks 在幕后创建一个新的 HTML 文档,并将其内容设置为 HTML 响应。由于这还不是 rendered/inserted,浏览器不会 download/evaluate 任何脚本或样式。 <head>
现在可以将新文档的 <head>
与当前文档进行比较,并且可以根据需要添加其他资产。
在具体的 Turbolinks 组件方面:
Visit
s 从 AJAX 响应创建 Snapshot
s(参见 Visit#loadResponse
)
Snapshot
s 在幕后创建 HTML 个元素(参见 Snapshot#fromHTMLString
SnapshotRenderer
s 处理合并 <head>
和替换 <body>
(SnapshotRenderer#mergeHead
and SnapshotRenderer#replaceBody
)
我目前正在研究 JavaScript TurboLinks 框架的基本内部 功能。据我了解,onclick 事件被分配给所有锚标记,以便能够防止默认操作(整页重新加载)并通过 AJAX 加载 link 内容。此处如有错误请指正
当 AJAX 回调接收整个 HTML 文档作为字符串时,如何在不(重新)加载脚本和样式标签的情况下呈现它?
脚本和样式只有在插入页面时才会被(重新)加载和评估。当通过 AJAX 收到 HTML 时,Turbolinks 在幕后创建一个新的 HTML 文档,并将其内容设置为 HTML 响应。由于这还不是 rendered/inserted,浏览器不会 download/evaluate 任何脚本或样式。 <head>
现在可以将新文档的 <head>
与当前文档进行比较,并且可以根据需要添加其他资产。
在具体的 Turbolinks 组件方面:
Visit
s 从 AJAX 响应创建Snapshot
s(参见Visit#loadResponse
)Snapshot
s 在幕后创建 HTML 个元素(参见Snapshot#fromHTMLString
SnapshotRenderer
s 处理合并<head>
和替换<body>
(SnapshotRenderer#mergeHead
andSnapshotRenderer#replaceBody
)