Как выполнить JavaScript-код внутри HTML-страницы, запрошенной Fetch API? - PullRequest
Новая
       2

Как выполнить JavaScript-код внутри HTML-страницы, запрошенной Fetch API?

1 голос
/ 23 апреля 2019

Единственный связанный с этим вопрос, который я нашел для этой проблемы, это: страница, загруженная AJAX, не может выполнить никакой javascript

Но я не хочу использовать JQuery.Я хочу использовать vanilla javascript.

Проблема заключается в том, что я не могу выполнить любой javacript, находящийся внутри html-страницы, который выбирается с использованием api fetch.

Вот мои файлы:

index.html: это исходная HTML-страница.Он запрашивает файл с именем index.js в качестве модуля ES6 

<!DOCTYPE html>
<html>

<head>
    <script type="module" src="index.js"></script>
</head>

<body>
    <main id="content" role="main"></main>
</body>

</html>

Затем у меня есть файл index.js: 

import openTemplate from './shared-assets/js/openTemplate.js';

const target = document.getElementById('content');

openTemplate('dashboard.html', target);

Это файл openTemplate.js: 

export default function openTemplate(templatePath, targetElement){
    fetch(templatePath).then(response => {
        response.text().then(html => targetElement.innerHTML = html);
    });
}

И, наконец, шаблон dashboard.html, который отказывается выполнять javascript: 

<h1>Dashboard</h1>
<script type="module">
    import myAlertFunction from 'myAlertFunction.js';

    // this is just a function that encapsulates an alert call
    // my real code will have much more complex functions being imported
    myAlertFunction('test');
</script>

Весь этот код должен привести к сценарию, в котором при загрузке моей страницы index.html выдается предупреждениедолжен отображаться с текстом «test», но этого не происходит.

Я хочу, чтобы это работало на Firefox Quantum> = 66

Чего мне не хватает?

...