Web API - get elements and event basis

1. How to get page elements
DOM In actual development, it is mainly used to operate elements
There are several ways to get the elements in the page ：
（1） according to ID obtain
（2） Get... According to the tag name
（3） according to HTML5 New method to get
（4） Special element acquisition

2. according to ID obtain
Use getElementById() Method can get the ID The element object of
element It's a Element object , If there is a specific in the current document ID If the element does not exist, it returns null
id Is a case sensitive string , Represents the unique name of the element to be found ID

// What is returned is the collection of obtained element objects , Store... As a pseudo array 
document.getElementsByTagName('li');// You can get some tags in this element 

var nav = document.getElementById('nav');//ID only one , What we got was this nav Elements 

getElementsByClassName Get a collection of certain elements according to the class name

document.getElementsByClassName('box');

querySelector Returns the first element object of the specified selector

var firstBox = document.querySelector('.box');

querySelectorAll() Returns a collection of all element objects of the specified selector

var allBox = document.querySelectorAll('.box');

3. Get special elements (body, html)

var bodyEle = document.body;// obtain body Elements 

var htmlEle = document.documentElement;// obtain html Elements 

The basis of the event ： Trigger response mechanism .
Javascript It gives us the ability to create dynamic pages , Events can be Javascript Detected behavior .
Every element in a web page can produce something that can trigger Javascript Events , For example, an event can be generated when a user clicks a button , And then do something .
Three elements of the event ： That is, the event consists of three parts ： Event source , Event type , Event handler .
Event source ： The event is triggered by , Button .
Event type ： How to trigger , What event ： Mouse click or pass or press ？
Event handler ： Through a function assignment