Skip to main content

JavaScript DOM

DOM (Document Object Model) connects web pages to programming languages.

HTML DOM methods: are the actions we can perform on HTML elements,
  • getElementById(id) - get the element with a specified id
  • getElementsByTagName(name) - get all elements with a specified tag name
  • appendChild(node) - insert a child node to x
  • removeChild(node) - remove a child node from x

 DOM properties:  DOM properties are values that we can set or change.
  • innerHTML - the inner text value of x (a HTML element)
  • nodeName - the name of x
  • nodeValue - the value of x
  • parentNode - the parent node of x
  • childNodes - the child nodes of x
  • attributes - the attributes nodes of 

The getElementById Method:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>html DOM</title>
</head>
<body>
<h1 id="demo"></h1>
<script>
    document.getElementById('demo').innerHTML = "Sadman Kabir Soumik";
</script>

</body>
</html>

In the example above, getElementById is a method, while innerHTML is a property.

Document Object: If we want to access any element in an HTML page, we need to access that element via the document object. 



 


Labels:

Comments

Post a Comment