Công ty thiết kế website chuẩn SEO Web Mới
Tìm kiếm
Công ty thiết kế website chuẩn SEO Web Mới

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, 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

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>

Chạy Thử

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>

Chạy Thử

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>

Chạy Thử

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
CEO Bùi Tấn Lực
Bùi Tấn Lực
CEO Bùi Tấn Lực người sáng lập ra Web Mới, là một lập trình viên website, người viết content, chuyên tư vấn các vấn đề về website và SEO website
  • Zalo
Chia sẻ nội dung đánh giá của bạn về Phương thức createTextNode() trong JavaScript
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 *
Đánh giá của bạn
Tên *
Email
Số điện thoại *
Bình luận, Hỏi đáp
Đăng ký tư vấn miễn phí
Tìm hiểu 1 năm không bằng lắng nghe 1 câu tư vấn
JAVASCRIPT Hàm Ngày/Giờ (Date/Time)
JAVASCRIPT DOM Phần tử HTML
Kiến thức CSS
Kiến thức PHP
Kiến thức về website
Thiết kế website
0398.259.259