This crash course focuses on the DOM WITHOUT JQUERY. In this part we will talk about what the JavaScript DOM (Document Object Model) is and we will look at the different selectors like
document.getElementById()
document.getElementsByClassName()
document.getElementsByTagName()
document.querySelector()
document.querySelectorAll()
We will also look at how to change content and styles via these selectors
CODE: Code for this video
http://www.traversymedia.com/downloads/domcrashcourse1.zip
JAVASCRIPT FUNDAMENTALS VIDEO:
BECOME A PATRON: Show support & get perks!
http://www.patreon.com/traversymedia
ONE TIME DONATIONS:
http://www.paypal.me/traversymedia
COURSES & MORE INFO:
http://www.traversymedia.com
FOLLOW TRAVERSY MEDIA:
http://www.facebook.com/traversymedia
Tweets by traversymedia
http://www.instagram.com/traversymedia
NEW DISCORD CHAT SERVER:
https://discord.gg/traversymedia
Original source
28 responses to “JavaScript DOM Crash Course – Part 1”
This is awsome .. thanks travis 🙂 i am a system admin started learning web developement 🙂 your video is really helping me .. keep up the good work. Cheers
on min 00:38 — you could have done odd/even filter just with that for loop. instead of i++, use i+2
Thank you!! perfect lesson.
Brad, what JavaScript should I learn after learning the basics?
a great lecture: clear, to the point
hey, how do you set up so that the page updates itself automatically when you type some code into js file ?
1) querySelector returns the first single element in the document that matches the CSS-type selector
2) querySelectorAll returns a collection of all elements in the document that match the selector
3) getElementsByClassName returns a collection of elements that have the specified class (not a selector)
4) getElementById*returns the single element in the document that has the specified ID (there can only be one)
5) getElementsbyTagName returns a collection of elements that have the specified tag name (type)
Thanks Traversy Media I really learn a lot from your series It is very good experience thanks again from a Pakistani boy ❤❤❤
This is awesome! Started my JavaScript journey a few days ago and now learning about Functions, Objects, Arrays, and Variables, then this popped up on my recommendation list so I decided to check it out. After the first 10 minutes of the video, I was just in awe after you used JavaScript to pull up all the information in the HTML… It was like magic!
영어 영상 보기너무 힘들다
thanks ..you explain really well. Just one question ..what about using Array.from() on the NodeList if needed to convert it to a regular array?
I have Atom, but not Atom live. My code doesn't show up in the browser console… help.
So funny.. "is kinda like using a sledgehammer to kill a mosquito, it's just not needed anymore"
thank you
In case anyone wonders, you don't need querySelectorAll for odd/even. Just use an if statement with modulus like x % 2 == 0. This can be handy for dynamically generating tables also.
I am working on an Event Lister thing with vanilla js. The drift is whenever i click the Submit btn it should log it in the console(for testing) btw before even clicking it it says cant get click of null but when i use it on codepen it works why doesn't it work on my pc?
Just awesome
I also just covered this topic in my channel. Did not go as deep in javascript since I have not yet taught my audience javascript.
Want to compare notes and see if I'm not feeding people too much poison lol
why i cant EXAMINE THE DOCUMENT OBJECT
Good tutorial 👍👍
It pleased me to see document.all mentioned here. An IE era invention that is shunned today but was once indispensable. It's more than a mere indexed collection by the way. It can also access elements by ID or name. It has superpowers.
Nice job, clear explanations, keep it up man
I should have subscribed your channel 1 year ago.😭😭😭😭😭😭. Videos are so good.
great video! u demystify dom. thanks a million
If I had seen this two months ago, I might still have a job!
This is one of the best tutorials I have seen on javascript taking me right back to the basics that I really could have used a long time ago. In the future, I will definitely have a lot better progress on my endeavors…
Took me around ninety minutes to get through the entire video because I was taking notes and coding along. You have such a great way to explain concepts that I couldn't understand yet.
I spent a good minute looking around for a video to explain how to work with the DOM. This is the only one I found lol. Very informative and actually helped me understand JS better as well also. Thank you.
Hello Brad i really want to understand JavaScript to the point a i feel like a ninja what did you do to understand it so well, did you read any book in specific ?