Untuk melihat data XML sebagai bagian dari halaman web, Anda dapat menggunakan XSLT; browser tidak menyediakan kemampuan ini sendiri.
XML adalah bahasa yang digunakan untuk menyusun, menyimpan, dan bertukar data. XSLT adalah bahasa lain yang memungkinkan Anda mengubah data XML menjadi format lain, seperti HTML.
Anda dapat menggunakan XSLT untuk menampilkan data XML pada halaman web HTML. Menggunakan XML dan XSLT untuk menampilkan data Anda dapat bermanfaat, karena memungkinkan Anda menyusun data dengan cara yang masuk akal untuk kebutuhan spesifik Anda.
Cara Menambahkan Data Contoh ke File XML
Untuk menampilkan data XML di halaman web, pertama-tama Anda harus membuat file XML dan menambahkan data ke dalamnya.
- Buat file baru bernama data.xml.
- Di dalam file XML, nyatakan pengkodean dan versi XML:
1.0 UTF-8?> - Tautkan file XML ke file lembar gaya XSL, yang akan Anda buat di langkah selanjutnya.
teks/xsl xmlstylesheet.xsl?> - Tambahkan data ke file XML. XML berisi data terstruktur, dan menyimpan setiap titik data dalam tag terpisah. Contoh ini menyertakan tag root yang disebut permainan. Di dalam permainan beri tag, simpan setiap game di dalamnya sendiri permainan menandai. Menyimpan data untuk setiap game seperti nama Dan pengembang dalam tag terpisah.
1.0 UTF-8?>
teks/xsl xmlstylesheet.xsl?>
<permainan>
<permainan>
<nama>Yang Terakhir dari Kita Bagian IInama>
<pengembang>Anjing nakalpengembang>
permainan>
<permainan>
<nama>Hantu Tsushimanama>
<pengembang>Produksi Sucker Punchpengembang>
permainan>
<permainan>
<nama>Terdampar Mautnama>
<pengembang>Produksi Kojimapengembang>
permainan>
permainan>
Cara Menggunakan XSLT untuk Membaca Data Dari File XML
Buat file XSL baru untuk mengulang setiap titik data di halaman XML dan tampilkan datanya.
- Di folder yang sama dengan file XML Anda, buat file baru bernama xmlstylesheet.xsl.
- Di dalam file, nyatakan versi XSL, dan tambahkan struktur tag XSL dasar:
1.0 UTF-8?>
<xsl: lembar gayaVersi: kapan="1.0"xmlns: xsl=" http://www.w3.org/1999/XSL/Transform">
// Kode Anda di sini
xsl: lembar gaya> - Di dalam tag XSL utama, tambahkan a templat menandai. Di sinilah Anda dapat menambahkan kode HTML khusus untuk menampilkan dan menata data XML Anda.
<xsl: templatcocok="/">
<html>
<tubuh>
// Kode HTML Anda ada di sini
tubuh>
html>
xsl: templat> - Di dalam tag body, gunakan the xsl: untuk masing-masing pemilih tag. Ini akan bertindak sebagai for-loop untuk mengulang masing-masing permainan tag bersarang di bawah permainan menandai.
<xsl: untuk masing-masingPilih="permainan/permainan">
xsl: untuk masing-masing> - Di dalam for-each loop, tampilkan nama dan poin data developer, menggunakan xsl: nilai-dari pemilih tag.
<xsl: nilai-dariPilih="nama" />
<xsl: nilai-dariPilih="pengembang" />
Cara Menampilkan Data di Halaman Web HTML
Anda tidak akan dapat membuka file XSLT atau XML secara langsung di browser untuk melihat data sebagai bagian dari halaman web. Buat file HTML baru, dan render data menggunakan iframe menandai.
- Di folder yang sama dengan file XML dan XSL Anda, buat file baru bernama index.html.
- Tambahkan struktur dasar file HTML. Jika Anda belum pernah menggunakan HTML sebelumnya, Anda dapat memolesnya pengantar konsep HTML.
html>
<html>
<kepala>
<judul>Contoh XML dan XSLTjudul>
kepala>
<tubuh>
tubuh>
html> - Di dalam tubuh tag, gunakan an iframe tag untuk menautkan ke file XML dan file XSL:
<h1>Contoh XML dan XSLTh1>
<P>Konten berikut dihasilkan dari file XML:P>
<iframesrc="data.xml"xslt="xmlstylesheet.xsl">iframe> - Buat file baru bernama style.css.
- Di dalam file, tambahkan beberapa CSS untuk menata halaman web Anda. Jangan ragu untuk memodifikasi CSS Anda menggunakan yang menarik lainnya Kiat dan trik CSS.
html,
tubuh {
tinggi: 100%;
margin: 0;
}tubuh {
tampilan: fleksibel;
justify-content: center;
menyelaraskan-item: tengah;
arah fleksibel: kolom;
}P {
margin-bawah: 24px;
} - Tautkan file HTML Anda ke gaya CSS dengan menambahkan yang berikut ke tag kepala HTML.
<tautanrel="lembar gaya"href="styles.css"> - Buka file HTML Anda menggunakan browser untuk melihat data XML Anda. Beberapa browser tidak mendukung XSLT, tetapi beberapa browser seperti Firefox mendukungnya.
Menampilkan Data di Halaman Web HTML
Ada banyak cara untuk menampilkan data di halaman web HTML, XML dan XSLT menjadi salah satunya. Jangan ragu untuk menjelajahi cara lain yang dapat Anda lakukan, seperti menyimpan dan menampilkan input pengguna menggunakan JavaScript.
