كيفية استخدام XSLT لعرض بيانات XML على صفحة ويب HTML

XML هي لغة تستخدم في هيكلة البيانات وتخزينها وتبادلها. XSLT هي لغة أخرى تسمح لك بتحويل بيانات XML الخاصة بك إلى تنسيقات أخرى ، مثل HTML.

يمكنك استخدام XSLT لعرض بيانات XML على صفحة ويب HTML. يمكن أن يكون استخدام XML و XSLT لعرض بياناتك مفيدًا ، حيث يسمح لك بهيكلة البيانات بطريقة تتناسب مع احتياجاتك الخاصة.

كيفية إضافة نموذج البيانات إلى ملف XML

لعرض بيانات XML على صفحة ويب ، تحتاج أولاً إلى إنشاء ملف XML وإضافة البيانات إليه.

1. قم بإنشاء ملف جديد يسمى data.xml.
2. داخل ملف XML ، أعلن عن الترميز وإصدار XML:

    1.0 UTF-8?>

3. اربط ملف XML بملف ورقة أنماط XSL ، والذي ستقوم بإنشائه في خطوة لاحقة.

    نص / xsl xmlstylesheet.xsl?>

4. أضف البيانات إلى ملف XML. يحتوي XML على بيانات منظمة ، ويخزن كل نقطة بيانات في علامة منفصلة. يتضمن هذا المثال علامة جذر تسمى
   instagram viewer
   ألعاب. داخل ألعاب علامة ، قم بتخزين كل لعبة فردية داخل اللعبة الخاصة بها لعبة بطاقة شعار. قم بتخزين البيانات لكل لعبة مثل اسم و مطور في علامات منفصلة.

    1.0 UTF-8?>
    نص / xsl xmlstylesheet.xsl?>
   <ألعاب>
   <لعبة>
   <اسم>آخرنا الجزء الثانياسم>
   <مطور>كلب مشاغبمطور>
   لعبة>
   <لعبة>
   <اسم>شبح تسوشيمااسم>
   <مطور>مصاصة لكمة للإنتاجمطور>
   لعبة>
   <لعبة>
   <اسم>الموت حبلااسم>
   <مطور>كوجيما للإنتاجمطور>
   لعبة>
   ألعاب>

كيفية استخدام XSLT لقراءة البيانات من ملف XML

قم بإنشاء ملف XSL جديد للتكرار خلال كل نقطة بيانات في صفحة XML وعرض البيانات.

1. في نفس المجلد مثل ملف XML الخاص بك ، قم بإنشاء ملف جديد يسمى xmlstylesheet.xsl.
2. داخل الملف ، أعلن عن إصدار XSL ، وأضف بنية علامة XSL الأساسية:

    1.0 UTF-8?>
   <xsl: ورقة الأنماطإصدار="1.0"xmlns: xsl=" http://www.w3.org/1999/XSL/Transform">
   // رمزك هنا
   xsl: ورقة الأنماط>

3. داخل علامة XSL الرئيسية ، أضف ملف نموذج بطاقة شعار. هذا هو المكان الذي يمكنك فيه إضافة رمز HTML مخصص لعرض بيانات XML الخاصة بك وتصميمها.

   <xsl: نموذجمباراة="/">
   <لغة البرمجة>
   <جسم>
   // كود HTML الخاص بك هنا
   جسم>
   لغة البرمجة>
   xsl: نموذج>

4. داخل علامة الجسم ، استخدم xsl: لكل محدد العلامات. سيعمل هذا بمثابة حلقة للحلقة خلال كل منها لعبة علامة متداخلة أسفل ملف ألعاب بطاقة شعار.

   <xsl: لكليختار="ألعاب / لعبة">
   
   xsl: لكل>

5. داخل حلقة for-each ، اعرض الاسم ونقاط بيانات المطور ، باستخدام ملف xsl: قيمة محدد العلامات.

   <xsl: قيمةيختار="اسم" />
   <xsl: قيمةيختار="مطور" />

كيفية عرض البيانات على صفحة ويب HTML

لن تتمكن من فتح ملف XSLT أو XML مباشرة في المستعرض لعرض البيانات كجزء من صفحة ويب. قم بإنشاء ملف HTML جديد ، وقم بعرض البيانات باستخدام امتداد iframe بطاقة شعار.

1. في نفس المجلد مثل ملفات XML و XSL ، قم بإنشاء ملف جديد يسمى index.html.
2. أضف البنية الأساسية لملف HTML. إذا لم تكن قد استخدمت HTML من قبل ، فيمكنك تحسينه مفاهيم HTML التمهيدية.

   لغة البرمجة>
   <لغة البرمجة>
   <رأس>
   <عنوان>مثال XML و XSLTعنوان>
   رأس>
   <جسم>
   
   
   جسم>
   لغة البرمجة>

3. داخل جسم علامة ، استخدم iframe علامة للارتباط بملف XML وملف XSL:

   <h1>مثال XML و XSLTh1>
   <ص>يتم إنشاء المحتوى التالي من ملف XML:ص>
   <iframesrc="data.xml"xslt="xmlstylesheet.xsl">iframe>

4. قم بإنشاء ملف جديد يسمى Styles.css.
5. داخل الملف ، أضف بعض CSS لتصميم صفحة الويب الخاصة بك. لا تتردد في تعديل CSS الخاص بك باستخدام أشياء أخرى مثيرة للاهتمام نصائح وحيل CSS.

   لغة البرمجة،
   جسم {
    الارتفاع: 100٪؛
    الهامش: 0؛
   }
   جسم {
    العرض: فليكس ؛
    تبرير المحتوى: مركز ؛
    محاذاة العناصر: مركز ؛
    الاتجاه المرن: العمود.
   }
   ص {
    الهامش السفلي: 24 بكسل ؛
   }

6. اربط ملف HTML الخاص بك بتصميم CSS عن طريق إضافة ما يلي إلى علامة رأس HTML.

   <وصلةrel="ورقة الأنماط"href="styles.css">

7. افتح ملف HTML الخاص بك باستخدام متصفح لعرض بيانات XML الخاصة بك. بعض المتصفحات لا تدعم XSLT ، لكن بعض المتصفحات مثل Firefox تدعمها.

عرض البيانات في صفحات الويب بتنسيق HTML

هناك العديد من الطرق لعرض البيانات في صفحات الويب بتنسيق HTML ، ومن بينها XML و XSLT. لا تتردد في استكشاف الطرق الأخرى التي يمكنك القيام بذلك ، مثل تخزين وعرض مدخلات المستخدم باستخدام JavaScript.