it is generally recommended to avoid inline JavaScript, but rarely is there an example of how to do it.
Here is my way of attaching events to buttons.
I’m not entirely happy with how much longer the recommended method is compared to a simple onClick attribute.
<a href="#" id="conid" onclick="confn()">Contact</a>
<script>
function confn(){
document.getElementById("conid").innerHTML = "1800-180-0000";
}
</script>click butotn on click after other value show and old name new value with replace.
document.getElementById("demo").innerHTML = "I have changed!";
document.getElementById("demo").value = "I have changed!";
document.getElementsByName("demo")['0'].value = "I have changed!";Any Tag With Value get and set using id, name with innerHTML and Value any string.
<script>
const OnEvent = (doc) => {
return {
on: (type, selector, callback) => {
doc.addEventListener(type, (event)=>{
if(!event.target.matches(selector)) return;
callback.call(event.target, event);
}, false);
}
}
};
OnEvent(document).on('click', '.btn', function (e) {
let div = document.createElement("div");
div.innerHTML = "click " + e.target.id + "!";
document.body.appendChild(div);
});
</script>
<button id="b1" class="btn">Button 1</button>
<button id="b2" class="btn">Button 2</button>
<button id="b3">Do nothing</button>button tag using text display block and none show.
<html>
<body>
<button type="button" onclick="confn()">Click Here</button>
<div id="conid"></div><br>
<input type="text" name="conno" value="">
<script>
function confn(){
document.getElementById("conid").innerHTML = "My Team Support Number Demo : 1800-180-0000";
document.getElementsByName("conno")['0'].value = "My Team Support Number Demo : 1800-180-0000";
}
</script>
</body>
</html>
value set in input tag with javascript, set value in div tag without input tag used.