Inserting Javascript code into HTML via Javascript

Question

I am trying to insert Javascript code into HTML via Javascript.

Inserting this code into HTML does not work, the code is not executed :

<script>

function callAlert(){
alert('test');
}

</script>

This code is executed :

<img src="xxx" onerror="alert('test')">

This does not call the function so the alert is not executed :

<img src="xxx" onerror="callAlert();">

Why onerror alert is executed and onerror calling function not?

Works fine for me. Check browser dev tools network and see what server returns for that request — charlietfl, Jan 07 '18 at 02:30
Works for me too. See this online compiler. https://repl.it/repls/ForthrightCloudyCock . The function will not fire if you script has errors in it so check the console as well. — pastaleg, Jan 07 '18 at 02:33
The Javascript code is inserted into DOM with Javascript, while page is already loaded, you've probably missed that part. — Tadeas J, Jan 07 '18 at 09:07
Then you should provide your code that's inserting the JS code. — Alohci, Jan 07 '18 at 10:08
Maybe you should change what you're alerting. You could be mistaking callAlert() with the alert — Nicholas Smith, Jan 08 '18 at 04:36

score 0 · Answer 1 · answered Jan 10 '18 at 03:05

You can no longer insert a <script> tag using el.innerHTML. This is a security issue that has been added fairly recently.

and scroll down to the Security considerations section.

It mentions that you can not add a <script> tag but it is not fool proof. Things like you describe can still cause script to run:

const name = "<img src='x' onerror='alert(1)'>";
el.innerHTML = name; // shows the alert

If you really need to add new JavaScript from existing JavaScript you will need to do something like the following:

var s = document.createElement('script');
s.textContent = 'function callAlert(){alert(\'test\');}';
document.head.appendChild(s);
callAlert();

score -1 · Answer 2 · answered Jan 07 '18 at 02:30

-1

Try putting the script into the head of the page, it could be that the function is executed before it's defiend.

If this isn't working please tell what error your console returns.

answered Jan 07 '18 at 02:30

Matthew

2 Answers2