Hướng dẫn add html tag in string typescript - thêm thẻ html trong chuỗi typecript

Tôi đã sử dụng BackTicks `` (không phải trích dẫn đơn) để bọc chuỗi HTML, vì BackTicks cho phép chúng tôi dễ dàng tạo một chuỗi nhiều dòng.

Bạn không nên sử dụng thuộc tính

Nếu bạn cần đặt các thuộc tính trên phần tử, hãy sử dụng phương thức SetAttribution.

Phương thức

document.getElementById("name").innerHTML="This is my test sample"

1. document.getElementById("name").innerHTML="This is my test sample"

   1 - Tên của thuộc tính có giá trị sẽ được đặt.

2. document.getElementById("name").innerHTML="This is my test sample"

   2 - Giá trị gán cho thuộc tính.

Trong ví dụ, chúng tôi đặt giá trị của thuộc tính

document.getElementById("name").innerHTML="This is my test sample"

document.getElementById("name").innerHTML="This is my test sample"

Copied!
const el = document.createElement('div');

el.innerHTML = `
  <span style="background-color: salmon; color: white;">
    Hello world
  span>
`;

el.setAttribute('title', 'my-title');

// ✅ add element to DOM
const box = document.getElementById('box');

box?.appendChild(el);

Nếu thuộc tính đã tồn tại, giá trị được cập nhật, nếu không một thuộc tính mới được thêm vào với tên và giá trị được chỉ định.

Bạn có thể đặt các kiểu trên phần tử bằng cách đặt các thuộc tính trên đối tượng

document.getElementById("name").innerHTML="This is my test sample"

Copied!
const el = document.createElement('div');

el.innerHTML = `
  <span>
    Hello world
  span>
`;

el.style.backgroundColor = 'salmon';
el.style.color = 'white';

// ✅ add element to DOM
const box = document.getElementById('box');

box?.appendChild(el);

Lưu ý rằng các thuộc tính đa từ được cưỡi lạc đà khi sử dụng đối tượng

document.getElementById("name").innerHTML="This is my test sample"

Bạn có thể sử dụng phương thức Phụ lục để thêm phần tử vào trang.

Phương pháp thêm một nút vào cuối danh sách trẻ em của yếu tố mà nó được gọi.

Lưu ý rằng chúng tôi đã sử dụng toán tử chuỗi tùy chọn (?.) Trước khi truy cập phương thức

document.getElementById("name").innerHTML="This is my test sample"

Các phép cắt chuỗi ngắn (?.) Các mạch ngắn mạch nếu tham chiếu là vô hiệu hóa (

document.getElementById("name").innerHTML="This is my test sample"

document.getElementById("name").innerHTML="This is my test sample"

Nói cách khác, nếu biến

document.getElementById("name").innerHTML="This is my test sample"

document.getElementById("name").innerHTML="This is my test sample"

document.getElementById("name").innerHTML="This is my test sample"

Biến

document.getElementById("name").innerHTML="This is my test sample"

document.getElementById("name").innerHTML="This is my test sample"

Làm thế nào để bạn thêm một thẻ vào một chuỗi TypeScript trong HTML?

Làm thế nào để bạn chuyển mã HTML vào một chuỗi?

Làm thế nào để bạn truy cập các phần tử HTML trong TypeScript?

Làm thế nào để bạn thêm một thẻ trong HTML?