Скрипт не работает, если parentNode==null?
Обнаружил, что javascript не работает, если он прописан внутри тега DIV, который не находится в DOM. И это хорошо!
Вот только не могу найти информацию, это правильно/неправильно и задокументировано ли где-то? Хочу построить на этом систему, но не уверен, что это так и останется. <html> <body> <div id ='content'>qwerty <script> alert(123); // здесь этот скрипт сработает </script> </div> </body> </html>
<html>
<body>
<div id ='content'>qwerty
<script>
var o=document.getElementById('content');
o.parentNode.removeChild(o); // удаляем сами себя из DOM прямо в процессе загрузки страницы
</script>
<script>
alert(123); // а здесь этот скрипт не сработает! это правильно?
</script>
</div>
</body>
</html>
P.S. данный фокус не проходит в IE8. |
Маэстро, потому что на момент удаления дива второй скрипт ещё не был загружен, а после удаления и вовсе перестаёт существовать.
|
Могу предложить заодно проверить что будет если один и тот же <script/> многократно вставлять в DOM.
Ато мне лень, но интересно :yes: |
Цитата:
-Неверно. Скрипт жив и существует. Попробуйте по факту загрузки документа вернуть его обратно в BODY и он даже сразу выполнится!
<html>
<body>
<div id ='content'>qwerty
<script>
window.onload = function()
{
alert('загрузили страницу, теперь страшный скрипт сработает')
document.body.appendChild(o);
};
var o=document.getElementById('content');
o.parentNode.removeChild(o); // удаляем сами себя из DOM прямо в процессе загрузки страницы
</script>
<script>
alert(123); // а здесь этот страшный скрипт не сработает! это правильно?
</script>
</div>
</body>
</html>
|
Не менее удивительно то, что при наличии внутри DIV_а трех скриптов первые два сработают до удаления DIV со страницы, а после последующей вставки обратно сработает только третий скрипт, но не сработают первые два!
<html>
<body>
<script>
window.onload = function()
{
alert('загрузили страницу и вставляем DIV со скриптами обратно в BODY; после этого сработает только скрипт №3')
document.body.appendChild(o);
};
</script>
<div id ='content'>qwerty
<script>
alert('скрипт 1'); // скрипт №1 сработает до удаления DIV из BODY, но не сработает после вставки DIV обратно в BODY
</script>
<script>
alert('скрипт 2'); // скрипт №2 сработает до удаления DIV из BODY, но не сработает после вставки DIV обратно в BODY
var o=document.getElementById('content');
o.parentNode.removeChild(o); // удаляем сами себя из DOM прямо в процессе загрузки страницы
</script>
<script>
alert('скрипт 3'); // скрипт №3 не сработает после удаления DIV из BODY, но сработает после вставки DIV обратно в BODY
</script>
</div>
</body>
</html>
|
Маэстро,
Пометь свои примеры [HTML run] чтобы было удобно смотреть. Может кто отпишется о отличиях между различными браузерами. |
Все это описано в спецификации: https://html.spec.whatwg.org/multipa...script-element
Если вкратце, то у элементов <script> есть внутренние флаги, отражающие состояние - parser-inserted, already-started и т.д. |
Цитата:
|
Цитата:
-я проверяю в IE10 и последних версиях Google Chrome, FireFox, Opera - результат одинаков. |
Цитата:
|
| Часовой пояс GMT +3, время: 04:26. |