Bùi Tấn Lực - 116
- 13/09/2025
Phương thức createTextNode() trong JavaScript dùng để tạo ra một node (nút) văn bản rồi nhập chữ vào sau đó thêm vào node phần tử HTML hoặc body, chi tiết như nào hãy cùng chúng tôi phân tích:
![]()
Phương thức createTextNode() trong JavaScript
Chức năng của Phương thức createTextNode() trong JavaScript
Phương thức createTextNode() trong JavaScript dùng để tạo ra một node (nút) văn bản rồi nhập chữ vào sau đó thêm vào node phần tử HTML hoặc body, node phần tử HTML sau đó được chèn vào body hoặc các thẻ HTML khác.
Cú pháp của Phương thức createTextNode() trong JavaScript
const nutvanban = document.createTextNode("vanban");
vanban: văn bản nhập chữ vào.
nutvanban: Nút văn bản.
Code Phương thức createTextNode() trong JavaScript
Phương thức createTextNode() thẻ li trong JavaScript
Ở ví dụ này mình tạo nút văn bản rồi thêm vào phần tử li:
const nodechu = document.createTextNode("Trang chủ");
<ul id="ulid">
<li>Giới thiệu</li>
<li>Blog</li>
</ul>
<p>Nhấn vào nút THÊM NODE HTML để tạo thẻ li và thêm vào ul.</p>
<button onclick="themNodeHtml()">THÊM NODE HTML</button>
<script>
function themNodeHtml() {
// Tạo phần tử HTML LI
const nodeli = document.createElement("li");
// Tạo node văn vản
const nodechu = document.createTextNode("Trang chủ");
// Thêm node chữ vào node phần tử HTML vừa tạo
nodeli.appendChild(nodechu);
// Lấy ID của thẻ UL
const ulid = document.getElementById("ulid");
// Chèn node li mới tạo vào ul ở trước vị trí 0 (vị trí đầu tiên), bạn có thể chọn children là 1 hoặc 2
ulid.insertBefore(nodeli, ulid.children[0]);
}
</script>
Phương thức createTextNode() body trong JavaScript
Ở ví dụ này mình tạo nút văn bản rồi thêm vào body:
const nodechu = document.createTextNode("Xin Chào!");
<p>Nhấn vào nút THÊM TEXT NODE để tạo node chữ thêm vào body</p>
<button onclick="themTextNode()">THÊM TEXT NODE</button>
<script>
function themTextNode() {
// Tạo node văn vản
const nodechu = document.createTextNode("Xin Chào!");
// Thêm node chữ vào body
document.body.appendChild(nodechu);
}
</script>
Phương thức createTextNode() thẻ p trong JavaScript
Ở ví dụ này mình tạo nút văn bản rồi thêm vào phần tử p:
const nodechu = document.createTextNode("Xin Chào!");
<div id="divid">Web Mới!</div>
<p>Nhấn vào nút THÊM TEXT NODE để tạo node chữ thêm thẻ p</p>
<button onclick="themTextNode()">THÊM TEXT NODE</button>
<script>
function themTextNode() {
// Tạo Node P
const nodep = document.createElement("p");
// Tạo node văn vản
const nodechu = document.createTextNode("Xin Chào!");
// Thêm node chữ vào node phần tử HTML P
nodep.appendChild(nodechu);
// Lấy ID của thẻ DIV và thêm node phần tử HTML P vào
document.getElementById("divid").appendChild(nodep);
}
</script>
Lời kết
Cảm ơn các bạn đã tham khảo bài viết Phương thức createTextNode() trong JavaScript.
- 0 Bình luận
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *