html - 如何在嵌入式 Google 文档 <iframe> 中显示页眉和页脚？

Question

我在 HTML 中嵌入了 Google 文档。我的 Google 文档有一个包含页码和图像的页脚。我想让文档在我的网页上显示页脚。以下是当前代码:

<div class="scroll-wrapper">
 <iframe src="https://docs.google.com/document/d/e/2PACX-1vR59LAO6EgV98_OVPaMO_WcI3Ds7Nemf0WzFO7xgYXoEXlnqDWncLsyCwvpQNUrBhQUUmmhp_TqKIRn/pub?embedded=true"></iframe></div>

和 css 类:

.scroll-wrapper {
-webkit-overflow-scrolling: touch;
overflow-y: scroll;
position: 0; 
right: 0; 
bottom: 0; 
left: 0;
top: 0;
display: block;
text-align:center;
}

.scroll-wrapper iframe {
height: 750px;
width: 56.25%;
}

如果使用我当前的代码无法完成此操作，有哪些替代方法可以做到这一点？

Answer 1

我从未使用过 Google 文档，而且我在您的 Google 文档文件中也找不到“页码”。

假设您可以编辑 Google 文档页脚，请为您的 Google 文档中的页脚 div 分配一个 ID。

例子:

<div class="your-footer" id="target-footer">
    ....
</div>

然后只需使用一个简单的并使用 jQuery“加载”函数来加载整个页面并只取出您想要的部分:然后在您显示 iframe 的页面中创建一个空的 div。

<div id="target-div"> </div>

最后是 jQuery:

$('#target-div').load('https://docs.google.com/document/d/e/2PACX-1vR59LAO6EgV98_OVPaMO_WcI3Ds7Nemf0WzFO7xgYXoEXlnqDWncLsyCwvpQNUrBhQUUmmhp_TqKIRn/pub?embedded=true #target-footer');

希望对您有所帮助。