Join Christian Hur for an in-depth discussion in this video Modifying text in the DOM, part of The DOM in JavaScript, jQuery, AngularJS, and React.
- [Male Instructor] The easiest way to get content…and modified content from an HDMI element…is by using the inner HTML property…of the element interface.…Now, this probably is quite useful…for inserting and replacing content…of the element or if you want to…just extract data from a particular tag.…You can only extract data from…a container tag, which means the container tag…is things like, for example,…your paragraph tags, you H1 tags,…and so on that contain tags.…
So what that means is that the code between…the elements opening and closing tag can be extracted.…That includes all the text in there as well as any…container tag or other element tags in there…can also be extracted.…And this is one of the ways how…dynamic webpages can be created on the fly…and also by using Javascript to do that,…you can simply change anything in the container tags.…So, lets' tale a look at this inner HTML…and see what it can do for us.…At the top here again is the output.…
I'm only showing the images here,…but if you scroll up you see more,…
Author
Christian Hur
Released
8/14/2017- What is the DOM?
- Working with properties, objects, and methods
- Traversing the DOM tree
- Manipulating elements with JavaScript
- Adding, appending, and deleting nodes with JavaScript
- Selecting content in the DOM with jQuery
- Updating the DOM tree with jQuery or AngularJS
- Making live updates for content
- Understanding React's virtual DOM approach
Skill Level Intermediate
Duration
Views
-
Introduction
-
Welcome1m
-
What you should know6m 9s
-
Using the exercise files1m 42s
-
-
1. The DOM Tree
-
Developer tools7m 12s
-
What is the DOM?5m 18s
-
The DOM tree5m 59s
-
The Node interface10m 50s
-
The Document object12m 8s
-
The Document methods10m 27s
-
Element objects10m 24s
-
Modifying text in the DOM9m 16s
-
Event objects11m 54s
-
Window object6m 56s
-
CSS properties and the DOM13m 50s
-
Traversing the DOM tree10m 18s
-
-
2. Manipulate the DOM with JavaScript
-
Updating content in place4m 16s
-
3. jQuery and the DOM
-
jQuery application structure15m 12s
-
Selecting content in the DOM10m 9s
-
-
4. AngularJS and the DOM
-
Angular application structure12m 15s
-
Updating the DOM tree10m 25s
-
From the DOM to directives11m 56s
-
-
5. The React Virtual DOM
-
React application structure10m 50s
-
Encapsulating code in components20m 43s
-
Live updates for content15m 57s
-
-
Conclusion
-
Next steps42s
-
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.
Share this video
Embed this video
Video: Modifying text in the DOM