Загрузка в тег script из отдельного файла php не работает

Часть основного php-файла:

    <script>
        let current_effect;

        function getRandomEffect() {
            let effect;
            do {
                effect = Math.floor(Math.random() * 3);
            } while (effect === current_effect);
            return effect;
        }

        function updateEffectContainer(effect) {
            // Construct the filename of the PHP file for the specified effect
            const filename = 'effect' + effect + '.php';

            // Load the HTML content from the PHP file using AJAX
            fetch(filename)
                .then(response => response.text())
                .then(html => {
                    // Update the effect container with the HTML content
                    document.getElementById("effect-container").innerHTML = html;
                })
                .catch(error => {
                    console.error('Error:', error);
                });
        }

        document.getElementById("changeEffectButton").addEventListener("click", function () {
            current_effect = getRandomEffect();
            updateEffectContainer(current_effect);
        });

        current_effect = getRandomEffect();
        updateEffectContainer(current_effect);
    </script>

эффект0.php:

<p>test</p>
<script type = "text/javascript">
    alert(test-alert);
</script>

Основной файл PHP выбирает эффект [0||1||2] при загрузке сайта и при нажатии кнопки «changeEffectButton». Я вижу, что отображается «тест» (в случае, если выбран effect0.php), но окно предупреждения не появляется.

Любая идея, почему и как это исправить?

Спасибо за каждый вклад! ^^

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
0
52
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы можете попробовать что-то вроде этого для печати с PHP с помощью js

<script>
    var xhr = new XMLHttpRequest();
    var url = "example.php";
    var method = "GET";
    xhr.open(method, url, true);
    xhr.responseType = "text";
    xhr.onload = function () {
        if (xhr.readyState === xhr.DONE) {
            if (xhr.status === 200) {
                var outputDiv = document.getElementById("effect-container");
                outputDiv.innerHTML = xhr.response;
                // Evaluate the script
                eval(outputDiv.getElementsByTagName('script')[0].innerHTML);
            } else {
                console.info("Error: " + xhr.status);
            }
        }
    };
    xhr.send();
</script>

в example.php вы можете иметь,

echo '<p>this is printable script</p>';

В вашем случае это код,

function updateEffectContainer(effect) {
        var xhr = new XMLHttpRequest();
        const url = 'effect' + effect + '.php';

        var method = "GET";
        xhr.open(method, url, true);
        xhr.responseType = "text";
        xhr.onload = function () {
            if (xhr.readyState === xhr.DONE) {
                if (xhr.status === 200) {
                    var outputDiv = document.getElementById("effect-container");
                    outputDiv.innerHTML = xhr.response;
                    // Evaluate the script
                    eval(outputDiv.getElementsByTagName('script')[0].innerHTML);
                } else {
                    console.info("Error: " + xhr.status);
                }
            }
        };
        xhr.send();
    }

И PHP есть,

echo '<p>test</p>
<script type = "text/javascript">
    alert("test-alert");
</script>';

Спасибо за ваше решение, но оно все еще не выполняется. :-( Содержимое p-тега распечатывается, но предупреждения не видно

Bambi 02.05.2023 12:52

вы используете PHP-сервер, такой как wamp или xammp?

vimuth 02.05.2023 13:01

да, я использую xampp, это актуально?! Я использую расширение в vsc: Live Server (Five Server)

Bambi 02.05.2023 13:13

@Bambi Думаю, ваше предупреждающее сообщение должно быть в кавычках - alert("test-alert");

vimuth 02.05.2023 18:27

да, я уже заметил эту ошибку ^^, все еще, к сожалению, не работает

Bambi 03.05.2023 07:27

@Bambi Сделал некоторые изменения и сейчас проверю.

vimuth 03.05.2023 10:23

Другие вопросы по теме