Skip to content

Commit d3397ee

Browse files
authored
[Term Entry] JS DOM Method: .createElement() (#6274)
* Create createElement.md A new entry on the .createElement() term under the DOM concept in JavaScript. Filed under content/javascript/concepts/dom-manipulation/terms/createelement/createelement.md. Includes: - An introduction to the concept - A Syntax section that provides the syntax for the concept (if applicable) - An Example section that provides an example demonstrating the concept in use (if applicable) * Minor changes * Rename the folder name from createelement to createElement * Update createElement.md * Update createElement.md * Update createElement.md * Update createElement.md * Update createElement.md * Update createElement.md * Update createElement.md * Update createElement.md ---------
1 parent c01fffa commit d3397ee

File tree

2 files changed

+55
-0
lines changed

2 files changed

+55
-0
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
---
2+
Title: '.createElement()'
3+
Description: 'Generates a new element node of the specified type.'
4+
Subjects:
5+
- 'Computer Science'
6+
- 'Web Design'
7+
Tags:
8+
- 'JavaScript'
9+
- 'DOM'
10+
- 'Methods'
11+
- 'Elements'
12+
CatalogContent:
13+
- 'introduction-to-javascript'
14+
- 'paths/front-end-engineer-career-path'
15+
---
16+
17+
In JavaScript, the **`.createElement()`** [method](https://www.codecademy.com/resources/docs/javascript/methods) of the `document` [object](https://www.codecademy.com/resources/docs/javascript/objects) creates a new element node of the specified type. This method returns an `HTMLElement` instance, which can be modified and appended to the DOM.
18+
19+
## Syntax
20+
21+
```pseudo
22+
document.createElement(type)
23+
```
24+
25+
- `type`: A string representing the tag name of the element to be created.
26+
27+
## Example
28+
29+
The following example demonstrates the usage of the `.createElement()` method:
30+
31+
```js
32+
function addElement() {
33+
// Create a div element
34+
const myDiv = document.createElement('div');
35+
36+
// Create a text node containing data
37+
const data = document.createTextNode('Hi, Codecademy!');
38+
39+
// Insert the data into the div element
40+
myDiv.appendChild(data);
41+
42+
// Add the element to the body
43+
document.body.appendChild(myDiv);
44+
}
45+
46+
// Call the function to add the element to the page
47+
addElement();
48+
```
49+
50+
The above code dynamically adds the following text to the webpage:
51+
52+
```plaintext
53+
Hi, Codecademy!
54+
```

documentation/tags.md

+1
Original file line numberDiff line numberDiff line change
@@ -195,6 +195,7 @@ Interface
195195
iOS
196196
Iterators
197197
Java
198+
JavaScript
198199
Join
199200
jQuery
200201
JRuby

0 commit comments

Comments
 (0)