Второй HTML-код из документа Google приводит к сбою макета ⇐ CSS

[Anonymous]

В моем веб-сайте Google Application Script я динамически загружаю Google Doc в формате HTML. Если я вставлю второй HTML точно таким же образом, макет выйдет из строя.
Вы можете проверить это здесь
Тестовый сценарий 1

• Загрузить страницу
• подождите, пока не появится текст (файл 1 загружен)
• перейти на другую вкладку и загрузить файл2
• вернуться на первую вкладку, макет другой (ошибка не согласуется с точки зрения того, когда и как она выполняется)< /li>

Сценарий тестирования 2

• Загрузить страницу

Тестовый сценарий 2

• Загрузить страницу
  подождите, пока увидите текст (файл 1 загружен)
• загрузите файл 3
• проверьте нижнюю часть страница. Появляется новый тест и все ок

Тестовый сценарий 3

• Загрузить страницу
• подождать, пока не появится текст (загружен файл 1)
• загрузить файл 3
• проверьте нижнюю часть страницы. Появляется новый тест, и все в порядке.
• перейдите на другую вкладку и загрузите файл2.
• вернитесь на первую вкладку, а макет другой ( ошибка несовместима с точки зрения того, когда и как она выполняется)

Как выглядит серверный код. ПРИМЕЧАНИЕ, что из файла file3 удалены теги .
Может ли кто-нибудь объяснить и, надеюсь, предложить решение этой проблемы?function doGet() {
return HtmlService.createHtmlOutputFromFile("index");
}

function getGoogleDocumentAsHTML(file){
console.log(file)
if (file == 1){
var docID ="1vRMY6bIkUc_J6qDOUJszIYAtIWH-aHTdYYgCmlL4"
}
if (file == 2 || file == 3){
var docID ="1VBpazC3SO2hx4PA7r3A2jud5O9-teNu0nvvnIDac"
}

var forDriveScope = DriveApp.getStorageUsed(); //needed to get Drive Scope requested

var url = "https://docs.google.com/feeds/download/ ... ormat=html";
var param = {
method : "get",
headers : {"Authorization": "Bearer " + ScriptApp.getOAuthToken()},
muteHttpExceptions:true,
};
var html = UrlFetchApp.fetch(url,param).getContentText()

// return cleanHTML(html)

if (file == 3 ){
return cleanHTML(html)
}

return html
//return HtmlService.createHtmlOutput(html).getContent()
}

function cleanHTML(html){

// nuke the whole head section, including the stylesheet and meta tag
html = html.replace(/.*/, '');
// remove almost all html attributes
// html = html.replace(/ (id|style|start|colspan|rowspan)="[^"]*"/g, '');
// html = html.replace(/ (id|class|style|start|colspan|rowspan)="[^"]*"/g, '');
// remove all of the spans, as well as the outer html and body
// html = html.replace(//g, '');
// clearly the superior way of denoting line breaks
// html = html.replace(/
/g, '
');

return html

}

и html-часть здесь





[*]

• HTML from file - loaded
• Second to be loaded

Load second HTML



Load third HTML




function getHTML(file){
google.script.run.withSuccessHandler(
function(output){
if (file == 1){
document.getElementById("testovani").innerHTML = output
}
if (file == 2){
document.getElementById("test").innerHTML = output
}
if (file == 3){
document.getElementById("test3").innerHTML = output
}
}
).getGoogleDocumentAsHTML(file);
}

document.addEventListener("DOMContentLoaded", function(event) {

var options ={}
var tabs = document.querySelectorAll('.tabs')

var tabsOptions = {
onShow : function(e) {
console.log(e.id)
switch (e.id){
case "test2":
console.log("testing")
break;
default:
}
}
}
var instance = M.Tabs.init(tabs, options);
getHTML(1)

});






Подробнее здесь: https://stackoverflow.com/questions/690 ... hes-layout