Giải thích về <script type = văn bản / mẫu văn bản>> </ script>

Tôi chỉ vấp phải thứ mà tôi chưa từng thấy trước đây. Trong nguồn của ứng dụng TODO ví dụ của Backbone.js ( Ví dụ về TODO của Backbone ), họ có các mẫu của họ bên trong một <script type = "text/template"></script>, chứa mã trông giống như PHP nhưng có thẻ JavaScript.

Ai đó có thể giải thích điều này với tôi? Thế này có hợp pháp không đấy?

Các thẻ script này là một cách phổ biến để thực hiện chức năng tạo khuôn mẫu (như trong PHP) nhưng ở phía máy khách.

Bằng cách đặt loại thành "văn bản / mẫu", đó không phải là tập lệnh mà trình duyệt có thể hiểu và do đó trình duyệt sẽ đơn giản bỏ qua nó. Điều này cho phép bạn đặt bất cứ thứ gì vào đó, sau đó có thể được trích xuất sau đó và được sử dụng bởi một thư viện tạo khuôn mẫu để tạo các đoạn mã HTML.

Xương sống không bắt buộc bạn phải sử dụng bất kỳ thư viện tạo khuôn mẫu cụ thể nào - có khá nhiều thư viện: Mustache , Haml , Eco , Google Clos , v.v. (thư viện được sử dụng trong ví dụ bạn liên kết là underscore.js ). Chúng sẽ sử dụng cú pháp riêng của chúng để bạn viết trong các thẻ script đó.

Nó hợp pháp và rất tiện dụng!

Thử cái này:

<script id="hello" type="text/template">
  Hello world
</script>
<script>
  alert($('#hello').html());
</script>

Một số thư viện tạo khuôn mẫu Javascript sử dụng kỹ thuật này. Handlebars.js là một ví dụ tốt.

Bằng cách đặt thẻ script typekhác text/javascript, trình duyệt sẽ không thực thi mã nội bộ của thẻ script. Đây được gọi là mẫu vi mô. Khái niệm này được sử dụng rộng rãi trong ứng dụng Trang đơn (hay còn gọi là SPA).

<script type="text/template">I am a Micro template. 
  I am going to make your web page faster.</script>

Đối với mẫu micro, loại thẻ script là text/template. Nó được giải thích rất tốt bởi người sáng tạo Jquery John Resig http://ejohn.org/blog/javascript-micro-templating/

Để thêm vào câu trả lời của Box9:

Backbone.js phụ thuộc vào underscore.js, chính nó thực hiện các mẫu microtem gốc của John Resig.

Nếu bạn quyết định sử dụng Backbone.js với Rails, hãy chắc chắn kiểm tra đá quý Jammit. Nó cung cấp một cách rất sạch để quản lý bao bì tài sản cho các mẫu. http://documentcloud.github.com/jammit/#jst

Theo mặc định, Jammit cũng sử dụng các microtemsheet của JResig, nhưng nó cũng cho phép bạn thay thế công cụ tạo khuôn.

Đó là một cách để thêm văn bản vào HTML mà không được hiển thị hoặc chuẩn hóa.

Không khác gì thêm nó như:

 <textarea style="display:none"><span>{{name}}</span></textarea>

<script type = “text/template”> … </script>Là lỗi thời. Sử dụng <template>thẻ thay thế.

Các mẫu jQuery là một ví dụ về một cái gì đó sử dụng phương thức này để lưu trữ HTML sẽ không được hiển thị trực tiếp (đó là toàn bộ vấn đề) bên trong HTML khác: http://api.jquery.com/jQuery.template/