본문 바로가기
Dev/JavaScript

[JavaScript] HTML in Javascript

by 코딩삐약 2022. 4. 27.
//HTML에서 document 객체를 JS로 가져올 수 있고 JS와 연결되어있다. 
document.title = "Hello! JS!";
//HTML 항목을 JS로 가져올 수 있다.

//Javascript에서 HTML element 가져오고 변경할 수 있다.
const title = document.getElementById("title");

title.innerText = "Got you!";

console.log(title.id);
console.log(title.className);

// getElementsByTagName() - tagName에 해당하는 element를 array로 다 가져옴 
const title = document.getElementsByTagName("h1");

// querySelector(CSS Selector 사용) - 단 하나만의 element를 가져옴 
// 여러 개 같은 거 있어도 첫번째 element만 가져옴
const title1 = document.querySelector(".hello h1"); 

// querySelector - 해당하는 element를 array로 다 가져옴
const title2 = document.querySelectorAll(".hello h1");
console.log(title);
console.log(title1);
console.log(title2);

 

'Dev > JavaScript' 카테고리의 다른 글

[JavaScript] CSS in Javascript  (0) 2022.04.28
[JavaScript] Events  (0) 2022.04.27
[JavaScript] Conditionals  (0) 2022.04.27
[JavaScript] Return  (0) 2022.04.27
[JavaScript] Functions  (0) 2022.04.26