HTML 
CSS 
PHP 
JavaScript 
SQL 
Bootstrap 
Solidity 
jQuery 
Git 
Chrome DevTools 
C++ 
Python One of the most important things you should know about if you want to use JavaScript in web development is Document Object Model, or simply DOM. Understanding what is DOM, how it works, and how you can access it allows you to have more control over your code.
In this lesson, you will learn about JavaScript DOM methods, how to target elements in the HTML with JavaScript, and how to manipulate them.
Contents
JavaScript DOM Methods: Main Tips
- A JavaScript DOM method exists as an action that can be executed on HTML elements.
- HTML elements have properties that are basically changeable values.
- In DOM HTML elements are classified as objects.
innerHTMLproperty is the simplest way to display something inside an element.
Pros Main Features
- Easy to use with a learn-by-doing approach
- Offers quality content
- Gamified in-browser coding experience
- The price matches the quality
- Suitable for learners ranging from beginner to advanced
- Free certificates of completion
- Focused on data science skills
- Flexible learning timetable
Pros Main Features
- Simplistic design (no unnecessary information)
- High-quality courses (even the free ones)
- Variety of features
- Nanodegree programs
- Suitable for enterprises
- Paid Certificates of completion
Pros Main Features
- A wide range of learning programs
- University-level courses
- Easy to navigate
- Verified certificates
- Free learning track available
- University-level courses
- Suitable for enterprises
- Verified certificates of completion
Using Javascript DOM
In the DOM JavaScript example below, we target the <p> element using the getElementById method and grabbing the <p> element's id id="demoz". The <p> element's content is manipulated using the innerHTML property:
Note: you can use the innerHTML property to change all of the HTML elements' content. This works for <html> and <body> tags, too.
JavaScript DOM Methods: Summary
- One of the simplest ways of targeting an HTML element often used in JavaScript is the
getElementByIdmethod. - Displaying content in an element is most easily and commonly performed by using the
innerHTMLproperty. You can learn more about using it here. - To get a better understanding on what is DOM, check out our JavaScript HTML DOM navigation tutorial.
