jQuery Mobile - Interviewfragen

Was ist jQuery Mobile?

Es handelt sich um ein Benutzeroberflächen-Framework, das auf dem jQuery-Kern basiert und zum Entwickeln reaktionsfähiger Websites oder Anwendungen verwendet wird, auf die auf Mobil-, Tablet- und Desktopgeräten zugegriffen werden kann.

Warum jQuery Mobile verwenden?

Es erstellt Webanwendungen so, dass sie auf Mobil-, Tablet- und Desktopgeräten auf die gleiche Weise funktionieren.
Es ist kompatibel mit anderen Frameworks wie PhoneGap, Whitelight usw.
Es bietet eine Reihe von berührungsfreundlichen Formulareingaben und UI-Widgets.
Es bietet Ihnen Funktionen für alle Mobil-, Tablet- und Desktop-Plattformen sowie effizientes Laden von Seiten und umfassendere Geräteunterstützung.

Einige Funktionen von jQuery Mobile auflisten?

Es basiert auf jQuery Core und dem UI-Framework "Weniger schreiben, mehr tun".
Es ist Open Source, plattformübergreifend und browserübergreifend kompatibel.
Es ist in JavaScript geschrieben und verwendet die Funktionen von jQuery und jQueryUI zum Erstellen mobiler, freundlicher Websites.
Es integriert HTML5, CCS3, jQuery und jQueryUI in ein Framework zum Erstellen von Seiten mit minimaler Skripterstellung.
Es enthält ein Ajax-Navigationssystem, das animierte Seitenübergänge verwendet.

Was sind die Vorteile von jQuery Mobile?

Es ist einfach, Anwendungen zu erlernen und zu entwickeln, wenn Sie Kenntnisse über HTML5- und CSS3-Funktionen haben.
Es ist plattform- und browserübergreifend kompatibel, sodass Sie sich nicht darum kümmern müssen, für jede Geräteauflösung einen anderen Code zu schreiben.
Es verwendet HTML5 zusammen mit JavaScript für die einfache Entwicklung von Webanwendungen.
Es ist so aufgebaut, dass derselbe Code automatisch vom mobilen Bildschirm zum Desktop-Bildschirm skaliert werden kann.

Was sind die Nachteile von jQuery Mobile?

Es gibt nur begrenzte Optionen für CSS-Themen, sodass Websites ähnlich aussehen können, die von diesen Themen erstellt werden.
Anwendungen, die mit jQuery Mobile entwickelt wurden, sind auf Mobiltelefonen langsamer.
Es wird zeitaufwändiger, wenn Sie jQuery Mobile mit anderen mobilen Frameworks kombinieren.
Es ist schwierig, ein vollständig individuelles visuelles Design bereitzustellen.

Welche zwei Möglichkeiten gibt es, um die jQuery Mobile-Bibliothek herunterzuladen?

Custom Download : Zum Herunterladen einer benutzerdefinierten Version der Bibliothek.
Latest Stable: Um die stabile und neueste Version der jQuery Mobile-Bibliothek zu erhalten.

Benennen Sie die CDN-Dateien, die mit jQuery Mobile verwendet werden?

Sie können folgende CDN-Dateien verwenden -

<link rel = "stylesheet" href = "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src = "https://code.jquery.com/jquery-1.11.3.min.js"> </ script>
<script src = "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"> </ script>

Was ist die Grundstruktur der jQuery Mobile-Seite?

<div data-role = "page" id = "pageone">
    <div data-role = "header">
      <h1>Header</h1>
    </div>

    <div data-role = "main" class = "ui-content">
      //content goes here
    </div>

    <div data-role = "footer">
      <h1>Footer</h1>
    </div>
</div>

Was ist das Attribut data-role = "header"?

Es erstellt die Kopfzeile oben auf der Seite.

Was ist das Attribut data-role = "main"?

Es wird verwendet, um den Inhalt der Seite zu definieren.

Was ist das Attribut data-role = "footer"?

Es wird eine Fußzeile am unteren Rand der Seite erstellt.

Was ist das Attribut data-role = "ui-content"?

Es enthält Auffüllung und Rand innerhalb des Seiteninhalts.

Wie kann ich mehrere Seiten in ein einzelnes jQuery Mobile-Dokument aufnehmen?

Das einzelne mobile jQuery-Dokument kann mehrere Seiten enthalten, die zusammen geladen werden, indem mehrere Divs mit dem Attribut data-role = "page" hinzugefügt werden.

Wie wird ein Dialogfeld auf der Seite angezeigt?

Verwenden Sie das Attribut data-dialog = "true" für eine beliebige Seite, um einen Dialog anzuzeigen.

Wie verwende ich Übergangseffekte auf der Seite?

Das Datenübergangsattribut wird verwendet, um die verschiedenen Übergänge auf den Dialog anzuwenden, z. B. Herunterfahren, Umdrehen usw.

Wie schließe ich die Schaltfläche auf der Seite?

Die Schaltfläche kann mithilfe des Attributs data-close-btn geschlossen werden.

Welches Attribut wird verwendet, um zum vorherigen Dialog zurückzukehren?

Das Attribut data-rel = "back" wird verwendet, um zum vorherigen Dialogfeld zurückzukehren.

Wie wende ich ein Thema für Dialoge, Kopf- und Fußzeilen oder Inhalte an?

Das Thema kann in den Dialog aufgenommen werden, indem Attributdaten-Themen zu Containern wie Kopf-, Fuß- oder Inhalten hinzugefügt werden.

Welche Klasse wird für abgerundete Ecken verwendet?

UI-Corner-All

Wie stelle ich das Symbol und die Symbolposition in der Schaltfläche ein?

Sie können das Symbol in der Schaltfläche mithilfe der Klassen ui-icon und ui-btn-icon-pos_name festlegen, um die Position für das Symbol anzugeben.

Wie setze ich einen Symbolschatten in meiner Schaltfläche?

Sie können Ihrer Schaltfläche Symbolschatten hinzufügen, indem Sie die Klasse ui-shadow-icon verwenden.

Wie entferne ich den grauen Kreis um das Symbol?

Sie können den grauen Kreis um das Symbol mithilfe der Klasse ui-nodisc-icon entfernen.

Wie erstelle ich ein einspaltiges Raster?

Verwenden Sie die Klasse ui-grid-solo im div-Tag, um ein einspaltiges Raster zu erstellen.

Wie erstelle ich ein zweispaltiges Raster und ein zweispaltiges Layout?

Fügen Sie dem div-Tag die Klasse ui-grid-a hinzu und fügen Sie zwei untergeordnete Container mit den Klassen ui-block-a und ui-block-b hinzu, um ein zweispaltiges Layout zu erstellen.

Wie erstelle ich ein dreispaltiges Raster?

Verwenden Sie die Klasse ui-grid-b im div-Tag, um ein dreispaltiges Raster zu erstellen.

Wie erstelle ich ein vierspaltiges Gitter?

Verwenden Sie die Klasse ui-grid-c im div-Tag, um ein vierspaltiges Raster zu erstellen.

Wie erstelle ich ein fünfspaltiges Raster?

Verwenden Sie die Klasse ui-grid-d im div-Tag, um ein fünfspaltiges Raster zu erstellen.

Wie erstelle ich eine Schaltfläche auf der Seite?

Erstellen Sie mit der Klasse ui-btn eine einfache Basisschaltfläche auf der Seite.

Wie erstelle ich eine Gruppe von Schaltflächen auf der Seite?

Erstellen Sie eine Gruppe von Schaltflächen vertikal und horizontal auf der Seite, indem Sie das Attribut data-role = "controlgroup" verwenden.

Wie erstelle ich eine Mini-Schaltfläche und eine Symbolposition auf der Seite?

Sie können mithilfe der Klasse ui-mini eine kleinere Schaltfläche auf der Seite erstellen und mithilfe der Klasse ui-btn-icon-ico_pos die Position der Symbole in der Schaltfläche anzeigen.

Wie wird die Datumsauswahl auf der Seite angezeigt?

Verwenden Sie das Attribut data-role = "date" im Eingabefeld, um es im Format TT / MM / JJ anzuzeigen.

Wie erstelle ich ein zusammenklappbares Widget?

Collapsible kann mithilfe des Attributs data-role = "reduzierbar" für einen Container erstellt werden.

Wie erstelle ich ein Kontrollgruppen-Widget?

Sie können die Kontrollgruppe mithilfe des Attributs data-role = "controlgroup" anzeigen.

Wie filtere ich die Kinder eines Elements?

Mit dem Attribut data-filter = "true" können Sie die untergeordneten Elemente eines beliebigen Elements filtern.

Was nützt das Flip-Switch-Widget?

Mit dem Flip-Schalter können Sie den Schalter aus- / einschalten oder wahr / falsch einstellen, indem Sie darauf klicken, um eine Eingabe im Booleschen Stil zu erhalten.

Was ist Listenansicht?

In der Listenansicht wird eine Liste der Elemente angezeigt. Das Attribut data-role = "listview" ist im Container enthalten, um die Liste in einer vertikal scrollbaren Liste anzuzeigen.

Was ist Rangelider?

Das Rangeslider-Widget bietet Ihnen zwei Ziehpunkte, mit denen Sie einen numerischen Wertebereich auswählen können.

Was sind mobile Events?

Ein Ereignis reagiert auf Benutzerinteraktionen, wenn der Benutzer auf eine bestimmte Seite klickt oder mit der Maus über ein Element usw. fährt.

Was ist ein Touch-Tap-Ereignis?

Es wird ausgelöst, wenn der Benutzer auf ein Element tippt, indem er die ID der Seite verwendet, um das Ereignis anzugeben, und die on () -Methode die Ereignishandler anfügt.

Was ist ein Touch Swipe-Ereignis?

Es wird ausgelöst, wenn der Benutzer mehr als 30 Pixel horizontal über ein Element zieht, indem er die ID der Seite verwendet, um das Ereignis anzugeben, und die on () -Methode die Ereignishandler anfügt.

Was sind Scroll-Start- und Scroll-Stop-Ereignisse?

Das Scroll-Start-Ereignis wird ausgelöst, wenn der Benutzer mit dem Scrollen der Seite beginnt, und das Scroll-Stop-Ereignis wird ausgelöst, wenn der Benutzer das Scrollen der Seite beendet, indem die ID der Seite zum Angeben des Ereignisses verwendet wird und die on () -Methode die Ereignishandler anfügt.

Was ist ein Orientierungsereignis?

Sie können das Orientierungsereignis auslösen, wenn der Benutzer das Gerät mithilfe des Orientierungsänderungsereignisses vertikal oder horizontal dreht . Mithilfe der Eigenschaft window.orientation wird angegeben, ob das Fenster oder das Gerät vertikal oder horizontal ausgerichtet ist.

Was ist ein Slider-Tooltip?

Sie können den Wert des Schiebereglers als Tooltip mit dem Attribut data-popup-enabled = "true" anzeigen.

Was ist Spaltenumschaltung?

Durch das Umschalten der Spalten werden die Spalten ausgeblendet, und der Benutzer kann Spalten nach seiner Wahl mithilfe des Attributs data-mode = "columntoggle" auswählen.

Was ist Tabellenreflow?

Es stellt die Daten im horizontalen Format dar, indem die Tabelle unter Verwendung des Attributs data-mode = "reflow" in eine gestapelte Darstellung reduziert wird.

Wie werden Tabellendaten im Streifen- und Strichformat angezeigt?

Sie können die Datensätze im Streifen- und Strichformat anzeigen, indem Sie die Klassen Tabellenstreifen und Tabellenstriche verwenden.

Was ist die Texteingabe verbessert?

Sie können die Qualität und Funktionalität von Texteingaben verbessern, indem Sie im Eingabefeld das Attribut data-advanced = "true" festlegen.

Wie ändere ich die Farbe des Symbols?

Sie können die Farbe des Symbols mithilfe der Klasse ui-alt-icon in Schwarz ändern. Standardmäßig sind alle Symbole weiß.

Wer hat das jQuery Mobile Framework entwickelt?

Es wurde vom jQuery-Projektteam im Jahr 2010 entwickelt und in JavaScript geschrieben.

Was ist das Daten-Ajax-Attribut?

Es zeigt an, ob Seiten über Ajax geladen werden müssen oder nicht.