生のjsでのdom操作メモ

import

import test from './test.js';
  ...
test();

const test = ()=>{
  console.log("test");
}

export default test;

querySelector

// ID
document.body.querySelector("#test");
// class
document.body.querySelector(".test");
// attribute
document.body.querySelector("[test='hoge']");

// ALL
document.body.querySelectorAll("a");

createElement

const dom = document.createElement('p');
dom.classList.add("red-text");
dom.innerText = "dom create";

//append
parent.appendChild(dom);

addEventListener

document.body.addEventListener("DOMContentLoaded",(e)=>{

});

// any dom
dom.addEventListener("click",(e)=>{
  console.log("onClick:",e);
});