Sử dụng đoạn mã HTML cho mẫu trong JavaScript (jQuery)

Question

Tôi hiện đang làm việc trên một ứng dụng nhỏ yêu cầu thông tin người dùng từ máy chủ của tôi và hiển thị chúng bằng cách sử dụng mẫu đặc biệt.

Lúc đầu, tôi chỉ hardcoded đoạn nhỏ trong jQuery:

$("<li><div class='outer'><table><tr><td rowspan=2 class='imgcontainer'><img class='thumb'/></td><td><span class='username'/></td></tr><tr><td><span class='name'/></td></tr></table></div></li>") 

tôi sao chép nó nhiều lần.

Thật xấu xí và tôi muốn nó làm nổi bật cú pháp và không có điều gì, vì vậy sẽ tốt hơn nếu tôi có nó trong chính tệp HTML.

Ngoài ra, nó sẽ làm cho việc hợp nhất dễ dàng hơn để ai đó chỉ có thể thay đổi một hoặc hai dòng.

Có mẫu cho điều này không? Tôi có thể đặt nó trong tệp HTML mà tôi đưa JS này vào (chỉ có một) và làm cho nó ẩn bằng cách sử dụng CSS.

Tùy chọn thứ ba mà tôi nghĩ chỉ là tạo một tệp HTML riêng và yêu cầu jQuery từ máy chủ để tách riêng nó. Kỹ thuật này có được sử dụng nhiều không?

Ngoài ra, có bất kỳ thuật ngữ nào tôi có thể sử dụng để mô tả những gì tôi đang làm không? (Khó đặt câu hỏi cho một khái niệm mà tôi không biết tên)

Answer 1

Tôi đã đưa ra câu trả lời tương tự trên SO earlier today. Những gì bạn đang tìm kiếm được gọi là micro-templates. John Resig đăng this on his blog. Về cơ bản bạn có thể lấy một tập dữ liệu json và áp dụng một mẫu cho dữ liệu để tạo html và cập nhật DOM.