Я хочу динамически добавлять javascript в существующий элемент script, что-то вроде:
var se = document.createElement('script');
se.setAttribute('type', 'text/javascript');
se.innerHTML = 'alert(1)';
document.getElementsByTagName('head').item(0).appendChild(se);
Интересная часть se.innerHTML = 'alert(1)';, и если она действительна? Если нет, то как я могу сделать это правильно?
Это не добавление JavaScript в существующий элемент script, он создает новый элемент script и добавляет его в документ.
Это работает в современных браузерах, но вы обычно этого не делали, если бы у вас не было кода в переменной, которую вам действительно нужно было выполнять в глобальном контексте (поэтому вы не могли использовать new Function() или eval изнутри функции).
Какой прецедент? Вам действительно нужно это делать?
Если вы попытались изменить содержимое script, написав текстовое содержимое <script>, которое уже было в документе, это не приведет к запуску нового содержимого script, оно просто изменится содержимое DOM. Точные обстоятельства того, что приводит к запуску нового script при использовании элемента <script>, варьируются от браузера к браузеру (хотя HTML5 пытается стандартизировать его); на данный момент лучше не делать ничего, кроме простого создания и добавления нового script. (И даже лучше избегать сценариев <script> вообще, если это возможно.)
Настройка innerHTML будет работать; Однако метод RoToRa с createTextNode лучше. Для <script> в документе старой школы-HTML innerHTML будет делать то же самое, что и createTextNode, так как <script> - это элемент CDATA, который не может содержать разметку. Это было бы важно для XHTML-служил-как-XML, хотя, и в целом, это чище, чтобы избежать innerHTML и его проблем с экранированием, когда вы просто хотите установить простой текст.
Кроме того, вы можете использовать [0] вместо item(0) (это определяется как часть привязок DOM JavaScript), и вы должны избегать getAttribute/setAttribute; вместо этого используйте свойства HTML DOM, такие как se.type=..., которые более читабельны и менее ошибочны в IE (хотя ошибки IE не повлияют на вас для атрибута type).
Все браузеры в настоящее время поддерживают свойство javascript text и будут оценивать текст, когда в документ добавляется новый элемент script (без атрибута src).
innerHTML или добавление дочерних узлов в элемент script не оценивает script во всех браузерах.
function addCode(code){
var JS= document.createElement('script');
JS.text= code;
document.body.appendChild(JS);
}
//тестовый пример
var s= 'document.body.ondblclick=function(e){\n'+
'e=window.event? event.srcElement:e.target;\n'+
'alert(e.id || e.tagName);\n'+
'}\nalert("ready to double click!");';
addCode(s);
Использование innerHTML будет прерываться, если текст содержит все, что можно интерпретировать как HTML, например <. Было бы лучше добавить один (или более) текстовый узел:
var se = document.createElement('script');
se.setAttribute('type', 'text/javascript');
se.appendChild(document.createTextNode('alert(1)'));
document.getElementsByTagName('head').item(0).appendChild(se);