How does inline Javascript (in HTML) work?

by

You’ve got it nearly correct, but you haven’t accounted for the this value supplied to the inline code.

<a href="#" onclick="alert(this)">Click Me</a>

is actually closer to:

<a href="#" id="click_me">Click Me</a>
<script type="text/javascript">
document.getElementById('click_me').addEventListener("click", function(event) {
    (function(event) {
        alert(this);
    }).call(document.getElementById('click_me'), event);
});
</script>

Inline event handlers set this equal to the target of the event.
You can also use anonymous function in inline script

<a href="#" onclick="(function(){alert(this);})()">Click Me</a>

More Related Contents:

  1. jQuery append function is just appending the html but not the classes related to it
  2. How to create a tag with Javascript?
  3. jQuery/JavaScript collision detection
  4. What browsers support HTML5 WebSocket API?
  5. Are HTML comments inside script tags a best practice? [closed]
  6. How to get current formatted date dd/mm/yyyy in Javascript and append it to an input [duplicate]
  7. How to validate inputs dynamically created using ng-repeat, ng-show (angular)
  8. How to scroll to an element inside a div?
  9. How to get pseudo element?
  10. JS function named `animate` doesn’t work in Chrome, but works in IE
  11. When is NodeList live and when is it static?
  12. Getting value of HTML Checkbox from onclick/onchange events
  13. How do I re-trigger a WebKit CSS animation via JavaScript?
  14. How to display a confirmation dialog when clicking an link?
  15. ReactJS – .JS vs .JSX
  16. Prevent typing non-numeric in input type number
  17. Image loaded event in for ng-src in AngularJS
  18. make html text input field grow as I type?
  19. jQuery sort elements using data id
  20. Bootstrap modal: is not a function
  21. Why does getElementById not work on elements inside the document element? [duplicate]
  22. How to block pop-up coming from iframe?
  23. Make a instead of by pressing Enter on a contenteditable
  24. Is there a way to use the Web Audio API to sample audio faster than real-time?
  25. Drag-and-drop file upload in Google Chrome/Chromium and Safari?
  26. Print repeating Page headers in Chrome [closed]
  27. AngularJs – Best-Practices on adding an active class on click (ng-repeat)
  28. JavaScript EventSource SSE not firing in browser
  29. Maximum Call Stack Size Exceeded During a setTimeout Call
  30. Does jQuery strip some html elements from a string when using .html()?

Leave a Comment