Javascript tips - pegar elemento por id, tag, name, class e seletor css

Dica #javascript de como pegar elemento com base no tipo de seletor.

// Selecionar elemento por ID
const elementById = document.getElementById('elementId');

// Selecionar elementos por tag
const elementsByTag = document.getElementsByTagName('tagName');

// Selecionar elementos por name
const elementsByName = document.getElementsByName('elementName');

// Selecionar elementos por classe
const elementsByClass = document.getElementsByClassName('className');

// Selecionar elementos por seletor CSS
const elementsBySelector = document.querySelectorAll('cssSelector');
const elementBySelector = document.querySelector('cssSelector');


// Podemos criar funções auxiliares

function getById(id){
 let element = document.getElementById(id);
 
 if(element) {
 return element;
 }
return null;
}

// let elementUserId = getById('user_id');


// getByClassName(className);
// getByTagName(tagName);
// getByName(name);
// getBySelector(selector);

1. document.getElementById('elementId') retorna o elemento correspondente ao #ID especificado.
2. document.getElementsByTagName('tagName') retorna uma lista de elementos que correspondem à #tag especificada.
3. document.getElementsByName('elementName') retorna uma lista de elementos que correspondem ao atributo #name  especificado.
4. document.getElementsByClassName(& #39 ;className& #39 ;) retorna uma lista de elementos que possuem a classe #CSS especificada.
5. document.querySelectorAll('cssSelector') retorna uma lista de elementos que correspondem ao seletor CSS especificado.
6. document.querySelector('cssSelector') retorna o primeiro elemento que corresponde ao seletor CSS especificado.

Torque 'elementId', 'tagName', 'elementName', 'className' e 'cssSelector' pelos valores reais que você deseja selecionar.