JSFiddle - React, Tailwind, and code Playground

by pvtd264

HTML

<!--  
Tìm hiểu các method của document:
- getElementsByClassName
- getElementsByTagName
- querySelector
- querySelectorAll
-->

<!--
document.getElementsByClassName(name) 
-> Lấy elements theo tên của Class

document.getElementsByTagName(name) 
-> Lấy elements theo loại tag

document.querySelector(selector)
-> Phương thức này để trả về thành phần đầu tiên phù hợp với bộ lọc CSS chúng ta truyền vào. Nếu không tìm thấy sẽ trả về null

document.querySelectorAll(selector)
-> Trả về tất cả các thành phần phù hợp với bộ lọc. Đầu ra của phương thức này sẽ là một đối tượng NodeList hoặc là một đối tượng empty
-->


<!DOCTYPE html>
<html lang="vi">
  <head>
    <meta charset="UTF-8">
    <title>Document</title>
  </head>
  <body>
    <h1 class="tieude">Tiêu đề bài viết</h1>
    <p>Line content</p>
    <p>Line content</p>
    <p>Line <b>content</b></p>
  </body>
</html>

JavaScript

console.log(document.getElementsByClassName("tieude"));
console.log(document.getElementsByTagName("h1"));
console.log(document.querySelector("b"));
console.log(document.querySelectorAll("p, h1"));