Hướng dẫn append alternative javascript - nối javascript thay thế

Ví dụ,

var newElement = document.createElement('div');
newElement.innerHTML = "
new content
";
element.appendChild(newElement);​​​​​​​​​​​​​​​​

Kết quả: "Nội dung mới" được thêm vào trong trang nhưng sẽ không có cảnh giác nào nói Hello World!

Tôi đã thử InsideHtml, InsertAdjacenthtml, Phụ lục, Phương pháp phụ lục. Nhưng vấn đề là JS và CSS không tải động.

Trong jQuery, after() hoạt động 👍🏻

$(selector).after("
new content
");

Có bất kỳ tương đương cho JavaScript thuần túy?

Ông Polywhirl

36.6K12 Huy hiệu vàng76 Huy hiệu bạc124 Huy hiệu đồng12 gold badges76 silver badges124 bronze badges

Hỏi ngày 11 tháng 4 lúc 16:27Apr 11 at 16:27

Bạn có thể sử dụng eval để thực thi các tập lệnh của mình dưới các định dạng chuỗi. JQuery cũng sử dụng eval trong một số phần của thao tác DOM dưới mui xe.

const content = "
new content<\/p>");

1 là

$(selector).after("
new content
");

2 và chứa một chuỗi có HTML hợp lệ, bạn có thể sử dụng phạm vi.CreateContextualFragment () (thực thi các tập lệnh 🚨)

const HTMLContent = "
new content
";
const newElement = document.createRange().createContextualFragment(HTMLContent);
document.body.appendChild(newElement)

Ví dụ làm việc

Đã trả lời ngày 16 tháng 4 lúc 22:05Apr 16 at 22:05

Lissettdmlissettdmlissettdm

10,9k1 Huy hiệu vàng12 Huy hiệu bạc35 Huy hiệu đồng1 gold badge12 silver badges35 bronze badges

Bạn phải gọi cảnh báo của mình khi có điều gì đó xảy ra, nếu bạn muốn cảnh báo được hiển thị khi bạn nối HTML, sau đó bọc nó trong chức năng tự thực hiện:

Đã trả lời ngày 11 tháng 4 lúc 16:32Apr 11 at 16:32

2

Các tập lệnh không thể được thêm trực tiếp vào DOM dưới dạng văn bản HTML và được thực thi. Tôi sẽ tách hành động thành hai giai đoạn. Chèn HTML và thêm tập lệnh vào phần cuối của thân tài liệu dưới dạng một đoạn ngữ cảnh.

const insertHTML = (domHTML, scriptHTML, target = document.body) => {
  const el = document.createElement('div');
  el.innerHTML = domHTML;
  document.body.appendChild(el);
  document.body.append(document.createRange().createContextualFragment(scriptHTML));
};

const domHTML = `
new content<\/p>`;

const scriptHTML = `
  

var script = document.createElement('script');
    script.src = 'some url'; // use this for external scripts
    script.innerHTML = 'your script'; // use this for writing your own script content

document.getElementsByTagName('head')[0].appendChild(script);

$(selector).after("
new content
");

$(selector).after("
new content
");