Fill div với html sử dụng javascript/jquery

Question

đây là vấn đề của tôi:

Tôi có một div:

<div id="legend"></div> 

và tôi muốn để điền vào nó, dưới những điều kiện nhất định, với các mã khác này:

<p>Showing results.... 
    Key: 
    <img src="/....">&lt;=1 
    &nbsp;<img src="/...">&lt;=2 
    &nbsp;<img src="/...">&lt;=3 
    &nbsp;<img src="/...">&lt;=4 
    &nbsp;<img src="/...">&lt;=5 

<p> 

Như bạn có thể thấy đây là một huyền thoại và vấn đề chính tôi nghĩ là tôi có dấu ngoặc kép không thể dễ dàng được bao gồm, ví dụ: Fill div with text

Cảm ơn sự giúp đỡ của bạn!

Answer 1

Bởi tôi hiểu, bạn đang cố gắng làm một việc như sau:

$("#legend").text("Your HTML here"); 

Để chèn HTML, bạn nên sử dụng .html(), tuy nhiên nó sẽ hiệu quả hơn để chỉ cần sử dụng Vanilla JS như vậy:

document.getElementById('legend').innerHTML = "Your HTML here"; 

Bây giờ, bạn cũng có đề cập đến gặp vấn đề trong dấu ngoặc kép. Vâng, có hai giải pháp có thể.

1: Sử dụng đơn dấu ngoặc kép quanh chuỗi của bạn: '<img src="/..." />'
2: Thoát khỏi dấu ngoặc kép: "<img src=\"/...\" />"

Và một điều nữa: Nếu những dòng mới thực sự trong HTML để chèn, bạn không thể có một chuỗi nhiều dòng trong JavaScript. Bạn có hai lựa chọn ở đây quá:

1: Thoát khỏi newline:

"<p>\ 
    Hello, world!\ 
</p>" 

2: CONCATENATE:

"<p>\n" 
    +"Hello, world!\n" 
+"</p>" 

Answer 2

Lắp mã html của bạn vào biến theo điều kiện của bạn (mà chúng tôi không biết), sau đó sử dụng html() để đặt mã đó thành phần tử.

var yourHtml = "your html"; 
$("#legend").html("yourHtml"); 

Như để đối phó với các dấu ngoặc kép, bạn có thể sử dụng dấu ngoặc đơn trong biến, chẳng hạn như:

var yourHtml = '<img src="/yourimgr.png">'; 

hoặc bạn có thể thoát khỏi dấu ngoặc kép:

var yourHtml = "<img src=\"/yourimgr.png\">"; 

Answer 3

1. Lưu trữ html đoạn bạn trong một số chuỗi var str= <p>write your complete code here</p>
2. $('#legend').html(yourconditionSatisfies?str:'')