Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Вставить в html через js код, который является скриптом (https://javascript.ru/forum/events/83429-vstavit-v-html-cherez-js-kod-kotoryjj-yavlyaetsya-skriptom.html)

NTOONT 05.12.2021 15:24

Вставить в html через js код, который является скриптом
 
Приветствую! Есть много страниц html, нужно в каждую вставить определенный код. Решил делать это через js. Но если через js у меня получается вставить div, то вставить скрипт не выходит.
html:
<!DOCTYPE html>
<html lang="en">
<head>
    <script src="test.js" type=text/javascript"></script>
    <meta charset="UTF-8">
    <title>Test</title>
</head>
<body>

</body>
</html>


js:
const headerText = `
<script type="text/javascript">
    for(let i=1; i<=3; i++) {
        alert("Из шляпы достали "+i+" кролика!")
    }
</script>
`;

function setHeader() {
    const header = document.createElement("script");
    header.innerHTML = headerText;
    document.body.insertAdjacentElement('afterbegin', header);
}
setHeader();

можете помочь?

рони 05.12.2021 15:32

NTOONT,
если только вставить))), то достаточно обернуть в DOMContentLoaded и экранировать 6 строку, если нужен рабочий скрип то скрипт и создавайте.

рони 05.12.2021 15:48

NTOONT,
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
     <script>
document.addEventListener( "DOMContentLoaded" , function() {
const scriptText = `
    for(let i=1; i<=3; i++) {
        alert("Из шляпы достали "+i+" кролика!")
    }
`;
function setHeader() {
    const header = document.createElement("div");
    const script = document.createElement("script");
    script.textContent = scriptText;
    header.append(script);
    header.append('dfbdfb');
    document.body.insertAdjacentElement('afterbegin', header);
}
setHeader();
  });
    </script>
</head>
<body>
</body>
</html>

рони 05.12.2021 16:12

NTOONT,
для тех кто любит погорячее)))
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
     <script>
document.addEventListener( "DOMContentLoaded" , function() {
const headerText = `
<script type="text/javascript">
    for(let i=1; i<=3; i++) {
        alert("Из шляпы достали "+i+" кролика!")
    }

<\/script>dfbdfb
`;
function setHeader() {
    const header = document.createElement("div");
    header.innerHTML = headerText;
    const script = document.createElement("script");
    let old =  header.replaceChild(script, header.querySelector("script"));
    document.body.insertAdjacentElement('afterbegin', header);
    script.text = old.text
}
setHeader();

  });
    </script>
</head>
<body>
</body>
</html>

NTOONT 05.12.2021 16:32

Спасибо! Нет возможности править html. Их более 100000 файлов. В них уже вставлены линки на js вида <script src="test1.js"></script>
Через эти js я пытаюсь сделать шапку, футер. И добавить скрипты яндекса и гугл.
Шапку и футер я смог выполнить через примеры, указанные ниже (через тег div). Думал, что по аналогии смогу и скрипт через скрипт запустить на html, но не вышло.
Пример работающего кода:
index.html:
<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Test</title>
</head>
<body>
<div class="test">
    <script src="test1.js"></script>
</div>
</body>
</html>

test1.js:
const headerText1 = `
<div class="cont">
Привет
</div>
`;

function setHeader() {
    const header1 = document.createElement("div");
    header1.innerHTML = headerText1;
    document.body.insertAdjacentElement('afterbegin', header1);
}

setHeader();

рони 05.12.2021 16:49

NTOONT,
не осилил, всё что мог выше.

voraa 05.12.2021 17:08

Переделанный пример из первого поста
<!DOCTYPE html>
<html lang="en">
<head>
    <script>
    // вместо src="test.js"
	const headerText = `
for(let i=1; i<=3; i++) {
    alert("Из шляпы достали "+i+" кролика!")
}
`;
 
	function setHeader() {
		const header = document.createElement("script");
		header.textContent = headerText;
		document.body.prepend(header);
	}

	document.addEventListener( "DOMContentLoaded" , function() {
		setHeader();
	})
   </script>
    <meta charset="UTF-8">
    <title>Test</title>
</head>
<body>
 
</body>
</html>

NTOONT 05.12.2021 17:44

Цитата:

Сообщение от voraa
// вместо src="test.js"

смысл как раз в том, что запустить в html script из отдельного файла через <script src="test.js" type=""></script>. Странно тег div таким способом можно вставить в html, а тег script получается нельзя?

voraa 05.12.2021 19:13

Так я не понял, что вам надо?
Ну поместите мой скрипт

const headerText = `
for(let i=1; i<=3; i++) {
    alert("Из шляпы достали "+i+" кролика!")
}
`;
  
    function setHeader() {
        const header = document.createElement("script");
        header.textContent = headerText;
        document.body.prepend(header);
    }
 
    document.addEventListener( "DOMContentLoaded" , function() {
        setHeader();
    })

в test.js
И вызывайте его
<script src="test.js" type=""></script>

Я же тут не могу написать пример вызова внешнего скрипта
Если нужно вызвать внешний скрипт,
то так.
function setHeader() {
        const header = document.createElement("script");
        header.src ='script_url.js'
        document.body.prepend(header);
    }

NTOONT 05.12.2021 21:16

Цитата:

Сообщение от voraa
Так я не понял, что вам надо?
Ну поместите мой скрипт

Да, это работает. Спасибо. Думал будет более универсально. Для меня сложнова-то.
А как в данном случае вставить такой скрипт, где часть кода внутри тега
<script>, например, это
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-666"
        crossorigin="anonymous"></script>


Часовой пояс GMT +3, время: 05:51.