Đặt văn bản theo lớp javascript

Thuộc tính

let text = document.getElementById('divA').textContent;
// The text variable is now: 'This is some text!'
1 của giao diện
let text = document.getElementById('divA').textContent;
// The text variable is now: 'This is some text!'
2 đại diện cho nội dung văn bản của nút và hậu duệ của nó

Ghi chú.

let text = document.getElementById('divA').textContent;
// The text variable is now: 'This is some text!'
1 và
let text = document.getElementById('divA').textContent;
// The text variable is now: 'This is some text!'
4 rất dễ bị nhầm lẫn, nhưng hai thuộc tính này khác nhau ở những điểm quan trọng

Giá trị

Một chuỗi, hoặc

let text = document.getElementById('divA').textContent;
// The text variable is now: 'This is some text!'
5. Giá trị của nó phụ thuộc vào tình hình

  • Nếu nút là một
    let text = document.getElementById('divA').textContent;
    // The text variable is now: 'This is some text!'
    
    6 hoặc một loại tài liệu, thì
    let text = document.getElementById('divA').textContent;
    // The text variable is now: 'This is some text!'
    
    1 trả về
    let text = document.getElementById('divA').textContent;
    // The text variable is now: 'This is some text!'
    
    5

    Ghi chú. Để lấy tất cả văn bản và dữ liệu CDATA cho toàn bộ tài liệu, hãy sử dụng

    let text = document.getElementById('divA').textContent;
    // The text variable is now: 'This is some text!'
    
    1

  • Nếu nút là phần CDATA, nhận xét, hướng dẫn xử lý hoặc nút văn bản, thì
    let text = document.getElementById('divA').textContent;
    // The text variable is now: 'This is some text!'
    
    1 trả về hoặc đặt, văn bản bên trong nút, i. e. ,
    let text = document.getElementById('divA').textContent;
    // The text variable is now: 'This is some text!'
    
    3
  • Đối với các loại nút khác,
    let text = document.getElementById('divA').textContent;
    // The text variable is now: 'This is some text!'
    
    1 trả về kết quả nối của
    let text = document.getElementById('divA').textContent;
    // The text variable is now: 'This is some text!'
    
    1 của mọi nút con, không bao gồm nhận xét và hướng dẫn xử lý. (Đây là chuỗi rỗng nếu nút không có nút con. )

Cảnh báo. Đặt

let text = document.getElementById('divA').textContent;
// The text variable is now: 'This is some text!'
1 trên một nút sẽ xóa tất cả nút con của nút và thay thế chúng bằng một nút văn bản duy nhất có giá trị chuỗi đã cho

Sự khác biệt từ InternalText

Đừng nhầm lẫn bởi sự khác biệt giữa

let text = document.getElementById('divA').textContent;
// The text variable is now: 'This is some text!'
7 và
let text = document.getElementById('divA').textContent;
// The text variable is now: 'This is some text!'
4. Mặc dù những cái tên có vẻ giống nhau, nhưng có những khác biệt quan trọng

  • let text = document.getElementById('divA').textContent;
    // The text variable is now: 'This is some text!'
    
    1 lấy nội dung của tất cả các phần tử, bao gồm cả phần tử
    document.getElementById('divA').textContent = 'This text is different!';
    // The HTML for divA is now:
    // 
    This text is different!
    0 và
    document.getElementById('divA').textContent = 'This text is different!';
    // The HTML for divA is now:
    // 
    This text is different!
    1. Ngược lại,
    document.getElementById('divA').textContent = 'This text is different!';
    // The HTML for divA is now:
    // 
    This text is different!
    2 chỉ hiển thị các phần tử "con người có thể đọc được"
  • let text = document.getElementById('divA').textContent;
    // The text variable is now: 'This is some text!'
    
    1 trả về mọi phần tử trong nút. Ngược lại,
    document.getElementById('divA').textContent = 'This text is different!';
    // The HTML for divA is now:
    // 
    This text is different!
    2 biết về kiểu dáng và sẽ không trả lại văn bản của các phần tử "ẩn"
    • Hơn nữa, vì
      document.getElementById('divA').textContent = 'This text is different!';
      // The HTML for divA is now:
      // 
      This text is different!
      2 tính đến các kiểu CSS, nên việc đọc giá trị của
      document.getElementById('divA').textContent = 'This text is different!';
      // The HTML for divA is now:
      // 
      This text is different!
      2 sẽ kích hoạt chỉnh lại dòng để đảm bảo các kiểu được tính toán cập nhật. (Reflows có thể tốn kém về mặt tính toán, và do đó nên tránh khi có thể. )
  • Cả
    let text = document.getElementById('divA').textContent;
    // The text variable is now: 'This is some text!'
    
    1 và
    document.getElementById('divA').textContent = 'This text is different!';
    // The HTML for divA is now:
    // 
    This text is different!
    2 đều xóa các nút con khi bị thay đổi, nhưng việc thay đổi
    document.getElementById('divA').textContent = 'This text is different!';
    // The HTML for divA is now:
    // 
    This text is different!
    2 trong Internet Explorer (phiên bản 11 trở xuống) cũng sẽ hủy vĩnh viễn tất cả các nút văn bản con cháu. Không thể chèn lại các nút vào bất kỳ phần tử nào khác hoặc vào cùng một phần tử sau khi làm như vậy

Sự khác biệt từ InternalHTML

let text = document.getElementById('divA').textContent;
// The text variable is now: 'This is some text!'
10 trả về HTML, như tên của nó chỉ ra. Đôi khi mọi người sử dụng
let text = document.getElementById('divA').textContent;
// The text variable is now: 'This is some text!'
11 để truy xuất hoặc viết văn bản bên trong một phần tử, nhưng
let text = document.getElementById('divA').textContent;
// The text variable is now: 'This is some text!'
1 có hiệu suất tốt hơn vì giá trị của nó không được phân tích cú pháp dưới dạng HTML

Bạn có thể lấy phần tử theo lớp không?

JavaScript getElementsByClassName được sử dụng để lấy tất cả các phần tử thuộc về một lớp cụ thể . Khi phương thức lấy phần tử theo tên lớp của JavaScript được gọi trên đối tượng tài liệu, nó sẽ tìm kiếm toàn bộ tài liệu, bao gồm các nút gốc và trả về một mảng chứa tất cả các phần tử.

Sự khác biệt giữa getElementById và getElementsByClassName là gì?

Chúng tôi muốn lấy phần tử duy nhất và phân bổ nó trong một biến, điều này có thể được thực hiện bằng cách sử dụng getElementById. Nhưng khi chúng tôi muốn lấy tất cả các phần tử sản phẩm và phân bổ chúng trong một biến thì về cơ bản, chúng tôi đang sử dụng getElementByClassName .

Làm cách nào bạn có thể thêm tên lớp trong JS?

Đang sử dụng. thuộc tính className . Thuộc tính này được sử dụng để thêm tên lớp vào phần tử được chọn. cú pháp. Nó được sử dụng để đặt thuộc tính className.

Hàm getElementsByClassName() trả về cái gì?

Phương thức getElementsByClassName() trả về một tập hợp các phần tử có (các) tên lớp được chỉ định . Phương thức getElementsByClassName() trả về một HTMLCollection.