Tìm hiểu về hai cách khác nhau để nhanh chóng xóa hoặc ẩn các phần tử khỏi DOM bằng JavaScript.
Có hai cách để xóa / ẩn các phần tử khỏi DOM bằng JavaScript. Hãy tự hỏi bản thân “một lúc nào đó mình có cần khôi phục lại yếu tố này không?” .
Nếu câu trả lời là có, thì bạn nên ẩn phần tử của bạn với thuộc tính style:
const hideElement = document.querySelector('#element-to-hide')
hideElement.style.display = 'none'
Nếu bạn không cần khôi phục lại phần tử, hãy sử dụng phương pháp này:
const removeElement = document.querySelector('#element-to-remove')
removeElement.parentNode.removeChild(removeElement)
Hãy nhớ rằng khi sử dụng querySelector()
để chọn các phần tử, #
dành cho các phần tử có thuộc tính ID, .
dành cho các lớp học.