Which one execute first?

Here is the code:

<script>
    document.getElementById('btn'开发者_如何学Python).addEventListener('mousedown',(function(){
        console.log('code');
    }));
</script>
<input id="btn" type="button" onmousedown="console.log('button')">

Which one will execute first and why?

---

The inline script executes, document.getElementById('btn') evaluates to null, and a TypeError is thrown.

Then your input tag fails to parse.

But let’s pretend you add a closing " to the onmousedown attribute and order the script element after the input element. Then you would see

button
code

because the events execute in the order they’re defined in.