Phương thức querySelector() phần tử trong JavaScript

Trình soạn thảo - Phương thức querySelector() phần tử trong JavaScript

Kết quả - Phương thức querySelector() phần tử trong JavaScript

Tự code rồi chạy thử... Chạy Thử 
<!DOCTYPE html>
<html>
<head>
<title>Phương thức querySelector() phần tử trong JavaScript</title>
</head>
<body>

<h1>Phương thức querySelector() phần tử trong JavaScript</h1>
<p>Dùng để thực hiện các hành động vào thẻ html bằng cách gắn bộ chọn css vào phương thức, phương thức chỉ áp dụng cho phần tử html đầu tiên, bộ chọn gồm thẻ html, class, id,....</p>

<div id="divid">
    <p>Hàng 1</p>
    <p>Hàng 2</p>
    <p>Hàng 3</p>
    <p>Hàng 4</p>
    <p>Hàng 5</p>
</div>
<p>Click vào nút ĐỔI MÀU để cho Hàng 1 thành màu đỏ</p>
<button onclick="doiMau()">ĐỔI MÀU</button>
<script>
function doiMau() {
  var divid = document.getElementById("divid");
  divid.querySelector("p").style.color = "red";
}
</script>
</body>
</html>