jQuery Mobile - Halaman

Pengguna dapat berinteraksi dengan halaman Mobile jQuery, yang mengelompokkan konten menjadi tampilan logis dan tampilan halaman. Tampilan halaman dapat dianimasikan menggunakan transisi halaman. Beberapa halaman dapat dibuat menggunakan dokumen HTML dan oleh karena itu, tidak perlu meminta konten dari server.

Tabel berikut menunjukkan tipe halaman secara detail.

Sr.No. Jenis & Deskripsi
1 Halaman tunggal

Satu halaman dibuat dalam dokumen HTML menggunakan cara standar penulisan template.

2 Template Multi-Halaman

Beberapa halaman dapat disertakan dalam satu dokumen HTML, yang dimuat bersama dengan menambahkan beberapa div dengan data-role = "page" .

3 Halaman Dialog

Dialog Modal membuka konten dalam overlay interaktif di atas halaman.

Konvensi, bukan persyaratan

  • Elemen atribut peran data seperti header, footer, halaman, dan konten digunakan untuk memberikan format dan struktur dasar halaman.

  • Untuk dokumen satu halaman, pembungkus halaman diperlukan untuk inisialisasi otomatis disetel sebagai opsional.

  • Elemen struktural dapat dikecualikan untuk halaman web dengan tata letak khusus.

  • Untuk mengelola halaman, pembungkus halaman dimasukkan oleh kerangka kerja jika tidak disertakan oleh markup.

Mengambil halaman lebih dulu

Dengan menyertakan atribut data-prefetch , kita dapat mengambil lebih dulu halaman-halaman ke dalam DOM dalam template halaman tunggal. Untuk informasi lebih lanjut klik di sini .

Cache DOM

Ketika memori browser penuh di DOM, maka itu memperlambat browser seluler atau mungkin macet karena memuat banyak halaman. Ada metode sederhana untuk menjaga kerapian DOM -

  • Ketika sebuah halaman dimuat melalui ajax, itu menunjukkan untuk menghapus halaman dari DOM saat Anda mengarahkan ke halaman lain.

  • Halaman sebelumnya yang telah Anda kunjungi dapat diambil kembali dari cache saat Anda mengunjunginya kembali.

  • Daripada menghapus halaman, Anda dapat memberi tahu jQuery mobile untuk menyimpannya di DOM dengan menggunakan baris berikut -

$.mobile.page.prototype.options.domCache = true;
  • Setel opsi domCache sebagai benar pada plugin halaman untuk menyimpan semua halaman di DOM, yang telah dikunjungi sebelumnya.

pageContainerElement.page({ domCache: true });