Вставить в 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();
можете помочь? |
NTOONT,
если только вставить))), то достаточно обернуть в DOMContentLoaded и экранировать 6 строку, если нужен рабочий скрип то скрипт и создавайте. |
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>
|
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>
|
Спасибо! Нет возможности править 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();
|
NTOONT,
не осилил, всё что мог выше. |
Переделанный пример из первого поста
<!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>
|
Цитата:
|
Так я не понял, что вам надо?
Ну поместите мой скрипт
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);
}
|
Цитата:
А как в данном случае вставить такой скрипт, где часть кода внутри тега <script>, например, это
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-666"
crossorigin="anonymous"></script>
|
Цитата:
В конце примечание (зеленое) script elements inserted using innerHTML do not execute when they are inserted. |
Цитата:
|
Цитата:
Эти атрибуты можно задать как свойства элемента Если взять предыдущий пример, то так
function setHeader() {
const header = document.createElement("script");
header.async = true;
header.crossorigin="anonymous";
header.src ='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-666';
document.body.prepend(header);
}
Про другие возможные свойства https://developer.mozilla.org/ru/doc...Element/script |
| Часовой пояс GMT +3, время: 11:37. |