Note:
Please note that I am a beginner in this and I found that sharing what I learn keeps me motivated in learning to code and helps me learn better and you can read about this technique called learning in public here
If you're an expert and you did find some mistake please comment it below as they say when you point the mistake the person never forgets thatπ. Also note that I will keep updating it as and when I learn new things.
Introduction
Rules: Just listen: below you will get the complete article on it then you have to teach it to somebody else.
DOM= document object model.
Know that it's built due to pain in something [[business#Pain points]] as everything else:
Okay so suppose you're on Instagram.com and it does give you personalised notifications right and instagram doesn't keep changing their websites to just help you
THis is where [[DOM]] comes into play they break your html website into objects and just change the the small object which needs to be changed.
Let's say somebody spills milk on your socks, do you change the entire dress or only the socks?
You can change the change
Every object has a property and methods.
Property: colour, nos of shoes and doors.
methods: break(), stop,
How to download or start using java Script
Inline
Inline basically means we are using opening up a html tag and basically changing the attributes of it.
<body> </body
= Normal html docs
<body onload="alert('hello');"
= inline boys.
Internal
Basically puting all your websites java code between the script tag like this. And this is inside the <body>
tag.
<script type="text/javascript">
alert("hello");
</script>
External
<script src="index.js" charset="utf-8"></script>
"
Positioning
Now where will you position or place the above code?
Unlike [CSS] you have to place this at the end after all your content is displayed cause you computer should run the elements like <h1>
first before doing any changes to the behaviour.
It makes sence right you can't make the dog stand if you don't have a dog in the first place.π
Changing text with JS
document.querySelector("input").click();
How to select any document and provide a hands off free
document.firstElementChild.lastElementChild.etc;
document.element
What are selectors
In [[CSS]] you probably know the syntax i.e
h1{color:red}
here the h1
is the selector.
Popular
document.QuerySelectorALL("#list .item)"
Top comments (1)
Well first of all, welcome to the wonderful world of webdev! Secondly, there actually was a few small things i noticed I thought I might share.
geeksforgeeks.org/difference-betwe...
hackinbits.com/interview-questions...
Hope I could help out a bit, and just like the original post if you find any inaccuracies/possibilities for improvement. Let me know! :)
But in the meantime, hope I could help and happy coding!