DEV Community

Kiruthiga S
Kiruthiga S

Posted on

DOM(part-4)

Element Selector:

JavaScript element selectors are built-in DOM methods used to target, select, and manipulate HTML elements on a webpage.

Finding HTML elements by id
Finding HTML elements by tag name
Finding HTML elements by class name
Finding HTML elements by CSS selectors
Finding HTML elements by HTML object collections

<!DOCTYPE html>
<html>
<style>
body{
    display:flex;
    align-items: center;
    justify-content: center;
}
</style>
<body>

<input id="name" type="text">
<button onclick="greet()">Greet</button>
<h2 id="message"></h2>

<script>
function greet() {
    const input = document.getElementById("name");
    const name = input.value;
    const message = document.getElementById("message");

    if (name == "") {
       message.innerText="Please enter text!"
    }
    else {
         message.innerHTML = '<img src="https://pbs.twimg.com/media/FgOkmTFaYAAGzYY.jpg" width="250">';
    }
}
</script>

</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Top comments (0)