I have the following code. How do I run this in VS Code with the debugger. I installed and tried live-server but maybe not doing it correctly.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button>Test</button>
<script src="index.js"></script>
</body>
</html>
index.js
var button = document.querySelector('button');
var fn = () => console.log(this)
function fn() {
console.log(this);
}
button.addEventListener('click', fn)
You can install the following extensions.
Once you have these two extensions installed, open the page index.html using the live server and then press F12 to open the developer tools for chrome.
And then you can paste a single line of code on the debugger like this.
document.querySelector('button').addEventListener('click',()=>{
console.log("Event Raised");
};
You can do like this
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button>Test</button>
<script>
const button = documnet.querySelector("button")
if(button) {
button.addEventListener("click", () => {
console.log("This Works")
})
}
</script>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With