تحفيز:
من أجل تسهيل رؤية المستخدمين لكميات كبيرة من البيانات، سنستخدم الترحيل الديناميكي، لذا فإن وظيفة الترحيل هي الوحدة الوظيفية الأكثر شيوعًا والأكثر استخدامًا التي رأيناها على موقع الويب. في الماضي، كان ترحيل المعلومات متصلاً بقاعدة البيانات، وكانت كل نقرة تتطلب دعم قاعدة البيانات الخلفية. وهذا لا يزيد العبء على الخادم فحسب، بل يؤثر أيضًا بشكل خطير على سرعة تصفح المستخدم.
فقط تخيل أنه إذا تم وضع وظيفة الترحيل على العميل، فما هو نوع التأثير الذي ستحدثه؟ هاها، ألق نظرة على التصميم أدناه! .
مادة:
يحتوي الترحيل الديناميكي لوحدة تخزين XML على ملفين: pages.xml وpages.xsl،
والوظائف هي:
ضع وظيفة الترحيل على جانب العميل. تصفية البيانات دون تحديث الصفحة، مما يؤدي إلى تحسين كفاءة بيانات التصفح بشكل فعال.
تأثير:
تصفح هنا
شفرة:
pages.xml
<?xml version="1.0" encoding="gb2312" ?>
<?xml-stylesheet type="text/xsl" href="pages.xsl" ?>
<فكرة زرقاء>
<فريق>
<blue_ID>1</blue_ID>
<blue_name>الطيران الشراعي</blue_name>
<blue_text>ترحيل بسيط</blue_text>
<blue_time>2002-1-11 17:35:33</blue_time>
<blue_class>موضوع XML</blue_class>
</فريق>
<فريق>
<blue_ID>2</blue_ID>
<blue_name>الطائر الطائر</blue_name>
<blue_text>زواجك سيؤذيك</blue_text>
<blue_time>2001-09-06 12:45:51</blue_time>
<blue_class>جوهر الري</blue_class>
</فريق>
<فريق>
<blue_ID>3</blue_ID>
<blue_name>كاو زي</blue_name>
<blue_text>تطبيق التعبيرات النمطية في منتدى UBB</blue_text>
<blue_time>2001-11-23 21:02:16</blue_time>
<blue_class>جوهر برمجة الويب</blue_class>
</فريق>
<فريق>
<blue_ID>4</blue_ID>
<blue_name>تايلانج</blue_name>
<blue_text>الدليل الكامل لحفلة التوجيه الكلاسيكية لنهاية العام v0.1</blue_text>
<blue_time>2000-12-08 10:22:48</blue_time>
<blue_class>منطقة الري بالمنتدى</blue_class>
</فريق>
<فريق>
<blue_ID>5</blue_ID>
<blue_name>mmkk</blue_name>
<blue_text>ملخص رسالة خطأ Asp</blue_text>
<blue_time>2001-10-13 16:39:05</blue_time>
<blue_class>جافا سكريبت</blue_class>
</فريق>
</بلو آيديا>
pages.xsl
<?xml version="1.0" encoding="gb2312" ?>
<xsl:stylesheet xmlns:xsl=" http://www.w3.org/TR/WD-xsl ">
<xsl:تطابق القالب="/">
<أتش تي أم أل>
<الرأس>
<title> نصائح عملية لحجم XML (3): الترحيل الديناميكي</title>
<نمط>
body,BlueIdea,team,blue_ID,blue_name,blue_text,blue_time,blue_class{ الخط: 12px "宋体"، "Arial"، "Times New Roman" }؛
table { حجم الخط: 12 بكسل؛ الحدود: 0 بكسل لون الحدود: #99CC99 #99CC99 #CCCCCC #CCCCCC؛
تمتد { حجم الخط: 12px اللون: أحمر }
.keybutton { المؤشر: حجم الخط: 12 بكسل؛ اللون: #003300؛}
</نمط>
<النص البرمجي>
<xsl:تعليق>
<![CDATA[
varOnePageNum=2;
varPageNum=1;
فار XMLPageNum=1;
صفحات الوظائف (العدد)
{
stylesheet=document.XSLDocument;
source=document.XMLDocument;
nodes=source.documentElement.childNodes;
len=nodes. length;
for(i=1;i<=(len/OnePageNum);i++);
XMLPageNum=i;
var firstNum=0;
var lastNume=0
;
إذا (Num=="السابق") {if (PageNum>1) PageNum -=1;}
إذا (Num=="next") {if (PageNum<XMLPageNum) PageNum +=1;}
if (Num=="last") {PageNum =XMLPageNum;}
sortField=document.XSLDocument.selectSingleNode(" //@expr ");
firstNum=OnePageNum*(PageNum-1)+1;
lastNum=OnePageNum*(PageNum-1)+OnePageNum;
text="childnumber(this)>="+firstNum+" & Childnumber(this)<="+lastNum;
SortField.value=text;
Layer1.innerHTML=source.documentElement.transformNode(stylesheet);
}
]]>
</xsl:تعليق>
</script>
</الرأس>
<الجسم>
<p align="center"><span>نصائح عملية لمجلد XML (3): الترحيل الديناميكي</span></p>
<جدول محاذاة = "المركز" العرض = "500" >
<تر>
<TD>
<button id="cmdfirstPage" class="keybutton" onclick="pages('first');" >الصفحة الرئيسية</button>
<button id="cmdpreviousPage" class="keybutton" onclick="pages('previous');" >الصفحة السابقة</button>
<button id="cmdnextPage" class="keybutton" onclick="pages('next');">الصفحة التالية</button>
<button id="cmdlastPage" class="keybutton" onclick="pages('last');">الصفحة الأخيرة</button>
</TD>
</tr>
</الجدول>
<div id="Layer1" name="Layer1"> <xsl:apply-templates حدد="BlueIdea" /></div>
</body>
</html>
</xsl:قالب>
<xsl:template match="BlueIdea">
<عرض الجدول = "500" الحدود = "1" محاذاة = "المركز" cellpadding = "1" تباعد الخلايا = "1" bordercolordark = "#ffffff" bordercolorlight = "#ADAAAD">
<tr bgcolor="#FFCC99" align="center">
<td>الرقم</td>
<td>الاسم</td>
<td>الموضوع</td>
<td>وقت النشر</td>
<td>التصنيف</td>
</tr>
<xsl:apply-templates حدد = "team" order-by = "blue_ID"/>
</الجدول>
</xsl:قالب>
<xsl:مطابقة القالب = "فريق">
<xsl:if expr="childnumber(this)>=1 & Childnumber(this)<=2 ">
<tr align="center">
<xsl:apply-templates حدد = "blue_ID" />
<xsl:apply-templates حدد = "blue_name" />
<xsl:apply-templates حدد = "blue_text" />
<xsl:apply-templates حدد = "blue_time" />
<xsl:apply-templates حدد = "blue_class" />
</tr>
</xsl:إذا>
</xsl:قالب>
<xsl:تطابق القالب = "blue_ID">
<td bgcolor="#eeeeee">
<xsl:قيمة />
</TD>
</xsl:قالب>
<xsl:تطابق القالب = "blue_name">
<TD>
<xsl:قيمة />
</TD>
</xsl:قالب>
<xsl:تطابق القالب='blue_text'>
<TD>
<xsl:قيمة />
</TD>
</xsl:قالب>
<xsl:مطابقة القالب = "blue_time">
<TD>
<xsl:قيمة />
</TD>
</xsl:قالب>
<xsl:تطابق القالب='blue_class'>
<TD>
<xsl:قيمة />
</TD>
</xsl:قالب>
</xsl:ورقة الأنماط>
يشرح:
1) search.xml هو ملف بيانات، وأعتقد أن الجميع لن يواجهوا أي مشكلة.
2) search.xsl هو ملف بتنسيق، وهناك العديد من الأشياء التي يجب الانتباه إليها.
(1) في البرنامج النصي:
العقد=source.documentElement.childNodes؛
الوظيفة هي: العثور على كافة العقد. Nodes.length هو إجمالي عدد العقد التي تستوفي الشروط
sortField=document.XSLDocument.selectSingleNode(" //@expr ");
الوظيفة هي: ابحث عن العقدة الأولى باستخدام السمة expr، لذا فإن العقدة المقابلة لها هي
<xsl:if expr="childnumber(this)>=1 & Childnumber(this)<=2 ">
ولذلك، فإن قيمة expr أثناء عملية التحميل الأولى هي
رقم الطفل(هذا)<=1 & رقم الطفل(هذا)>=2
حول > قد تكون أكثر دراية به. إذن ما هو & إنها "و".
يمكنك العثور على الآخرين في كتب XML.
وصف المعلمة:
OnePageNum: عدد البيانات المعروضة في كل صفحة
رقم الصفحة: رقم الصفحة الحالية
XMLPageNum: إجمالي عدد الصفحات
firstNum: قيمة البيانات الأولى للصفحة الحالية
lastNum: قيمة البيانات الأخيرة للصفحة الحالية
(2) في النص:
<xsl:if expr="childnumber(this)>=1 & Childnumber(this)<=2 ">
في الترحيل، نحتاج إلى إخراج البيانات المناسبة، لذلك نستخدم شرط الحكم if للتحكم فيها.
في البداية، طلبنا إخراج قيم العقدتين الأوليين فقط.
رقم الطفل (هذا)
الوظيفة: إرجاع رقم العقدة الحالية في قائمة العقد العليا الخاصة بها، الرقم الافتراضي للعقدة الأولى في القائمة هو 1.
في الترحيل، نحكم على الصفحة التي تنتمي إليها بناءً على رقم العقدة.
EXPR
لا أعرف إذا كنت قد لاحظت أننا استخدمنا الاختبار في المرتين الأوليين، ولكن هذه المرة استخدمنا expr.
هناك بعض الاختلافات بينهما كما أن استخدامها مختلف أيضًا.
expr ─ تعبير لغة البرمجة النصية، نتيجة الحساب هي "صحيح" أو "خطأ"؛ إذا كانت النتيجة "صحيحة" واجتازت الاختبار، فسيتم عرض المحتوى في الإخراج (يمكن حذف هذه السمة).
اختبار ── شروط اختبار البيانات المصدر.
<button id="cmdfirstPage" class="keybutton" onclick="pages('first');" >الصفحة الرئيسية</button>
وتتمثل الوظيفة في إعادة البيانات إلى الصفحة السابقة. تعمل الأزرار الأخرى بالمثل.
نقطة إضافية واحدة: كيفية استخدام ملفات أمثلة XML
1) احفظ الملفين في كل مثال على حدة وفقًا لأسماء الملفات الخاصة بهما.
2) استخدم متصفحًا لتصفح ملف XML. هذا هو التأثير الذي ستراه، يجب أن يكون جيدًا!
حاشية:
هاها، يمكنك إضافة وظيفة الترحيل بعد الفرز الديناميكي. ثم اجعل عدد القوائم قابلاً للتكوين. استخدم خيالك لجعل هذه الوظائف أكثر كمالا. يمكنك البحث عن طرق أفضل لتنفيذ وظيفة الترحيل. من الرائع أن نتناقش مع بعضنا البعض!