LAYTPL هو محرك قالب JavaScript التخريبي. يستخدم أساليب تنفيذ ذكية لجعل حجمها صغيرًا ورائعًا. لا يقتصر الأمر على الأداء النهائي ، ولكنه يحتوي أيضًا على جميع وظائف المحرك الأمامي التقليدي تقريبًا. يتم إنشاء كل سحر التحول بأقل من 1 كيلو بايت من الكود ، والذي يبدو وكأنه ثورة ، أو لا ، ولكن لا شك أن LAYTPL تقدمه بالفعل إلى العالم بأخف طريقة. إذا لم تتعرض أبدًا لهذا التطبيق ، فهذا لا يهم. ستجعلك القصة التالية غير قادرة على الانتظار لاختيار Laytpl ، ومنذ ذلك الحين ، يمكنك فهم عرض البيانات للصفحة بشكل أفضل والوصول إلى ذروة حياتك!
ميزة laytpl
• الأداء الممتاز ، أسرع مرة واحدة تقريبًا من ArtTemplate و DOT ، والتي تُعرف باسم ملك الأداء ، وأسرع 20-40 مرة من BaiduTemplate و KissyTemplate ، وما إلى ذلك. كلما زاد حجم البيانات وتردد التقديم ، كلما كان ذلك وضوحًا.
• المجلد ببساطة صغير إلى أقصى ، أقل من 1 كيلو بايت ، وسيصبح أصغر في المستقبل.
• لديها آليات أمنية مثل Escape ، ولديها وظائف الإبلاغ عن الأخطاء العلمية نسبيًا.
• يمكن كتابة JavaScript الأصلي بشكل تعسفي في القالب لضمان مرونة القالب بشكل كامل
• دعم التطبيق على منصة Node.js
• دعم جميع المتصفحات السائدة القديمة أو الحديثة
كيفية استخدام
نسخة الكود كما يلي:
// الخطوة 1: اكتب القالب. يمكنك استخدام علامة نصية لتخزين القوالب ، مثل:
<script id = "demo" type = "text/html">
<h1> {{d.title}} </h1>
<ul>
{{# for (var i = 0 ، len = d.list.length ؛ i <len ؛ i ++) {}}
<li>
<span> الاسم: {{d.list [i] .name}} </span>
<span> المدينة: {{d.list [i] .city}} </span>
</li>
{{#}}}
</ul>
</script>
// الخطوة 2: إنشاء عرض. تستخدم لتقديم نتائج تقديم.
<div id = "view"> </viv>
// الخطوة 3: تقديم القالب
بيانات var = {
العنوان: "الحصار الأمامي" ،
القائمة: [{name: 'xianxin' ، المدينة: 'Hangzhou'} ، {name: 'Xie Liang' ، City: 'Beijing'} ، {name: 'Qianqian' ، City: 'Hangzhou'} ، {name: 'Dem' ، City: 'Beijing'}]
} ؛
var gettpl = document.getElementById ('Demo'). innerhtml ؛
laytpl (getTpl) .render (البيانات ، الدالة (html) {
document.getElementById ('view'). innerhtml = html ؛
}) ؛
وصف الوثائق
1. بناء جملة القالب
إخراج حقل عادي دون الهروب من html: {{d.field}}
إخراج الحقل العادي والهروب html: {{= d.field}}
البرنامج النصي JavaScript: {{# javaScript strupt}}
2. طريقة مدمجة
1): laytpl (قالب) ؛ // الوظيفة الأساسية ، إرجاع كائن
var tpl = laytpl (قالب) ؛
tpl.render (البيانات ، رد الاتصال) ؛ // طريقة تقديم ، عوائد نتائج تقديم ، يدعم وضعين: غير متزامن ومتوازنة
أ): غير متزامن
tpl.render (البيانات ، الوظيفة (النتيجة) {
console.log (نتيجة) ؛
}) ؛
ب): متزامن
var result = tpl.render (data) ؛
console.log (نتيجة) ؛
2): laytpl.config (خيارات) ؛ // تهيئة التكوين
الخيارات كائن
{افتح: "ابدأ علامة" ، أغلق: "إغلاق العلامة"}
3): laytpl.v // الحصول على رقم الإصدار
أشياء يجب ملاحظتها
1. فقط قدم laytpl.js مباشرة ، ويمكنك أيضًا استخدام Seajs وغيرها من التحميل المعياري مباشرة.
2. يمكن استخدام laytpl في الإرادة ، سواء في الأعمال التجارية أو في المنصات الشخصية.
3. تأكد من الحفاظ على المصدر في أي مناسبة ، ولا تقم بإزالة تعليقات رأس Layoutpl.JS.
الموقع الرسمي: http://sentsin.com/layui/laytpl/
تنزيل: //www.vevb.com/codes/207072.html