JQuery ajaxGet-Beispiel

DOM steht für Document Object Model und gibt Standards für den Zugriff auf HTML-Elemente und deren Attribute vor. Diese können mit Jquery manipuliert werden ajaxGet() Methode. Über eine HTTP-GET-Anfrage können Daten vom Server geladen werden. Wenn wir auf den Server zugreifen, ohne die Webseite neu zu laden, können wir die Informationen mithilfe der GET-Option zur Anforderung an den Server übergeben. Der Zweck des GET besteht darin, die Informationen abzurufen. Browser speichern das Ergebnis der GET-Anfrage im Cache, und wenn dieselbe Anfrage erneut gestellt wird, zeigen sie das Cache-Ergebnis an, anstatt die gesamte Anfrage erneut auszuführen.

  • Einführung in JQuery
  • Suchen nach doppelten Eingabeelementen mit jQuery

JQuery ajaxGet-Syntax

$.get(url, [data], [success], [dataType] )

Wo,

  • URL: Adresse, an die die Anfrage gesendet wird.
  • Daten: Es handelt sich um das Schlüssel/Wert-Paar, das an die angeforderte URL gesendet wird. Es handelt sich um einen optionalen Parameter.
  • Erfolg: Dies ist die optionale Rückruffunktion, die ausgeführt wird, wenn die Daten erfolgreich geladen wurden.
  • Datentyp: Dies ist der Datentyp der von der Rückruffunktion erwarteten Daten. Die erwarteten Standarddatentypen sind: „html“, „xml“, „json“ und „script“.

Notiz: In der obigen Syntax von ajaxGet eckige Klammer stellt die optionalen Parameter dar, die verwendet werden sollen.

JQuery ajaxGet-Beispiel

Das folgende Beispiel zeigt die drei Jquery-Get-Methoden, z Text(), html() Und val() um DOM und eine JQuery-Methode zu manipulieren, um den Attributwert zu erhalten.

<!DOCTYPE html>
<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$(document).ready(function(){
  $("#button1").click(function(){
    alert("Text: " + $("#d1").text());
  });
  $("#button2").click(function(){
    alert("HTML: " + $("#d1").html());
  });
  $("#button3").click(function(){
      alert("value: " + $("#d2").val());
  });
  $("#button4").click(function(){
         alert($("#d3").attr("href"));
  });
});
</script>
</head>
<body>
<p id="d1">Note: observe the representation of word <em>emphasized</em> in text and html method.</p>

<p>Name:<input type="text" id="d2" value="Incredible India"></p>
<p><a href="http://dummy.com" id="d3">dummy.com</a></p>
<button id="button1">Returns Text</button>
<button id="button2">Returns HTML</button>
<button id="button3">Returns Value</button>
<button id="button4">Returns href Value</button>
</body>
</html>
 
  • Im obigen Beispiel haben wir gezeigt, wie das hervorgehobene Wort in der text()-Methode und in der HTML-Methode manipuliert wird.
  • Alert(“Text: ” + $(“#d1″).text()): Hier wird #d1 als Selektor für den Tag-P-Inhalt verwendet. Wenn der Benutzer auf die Schaltfläche klickt, wird die Methode text() aufgerufen, die die Klartextdaten zurückgibt.
  • Alert(“HTML: ” + $(“#d1″).html(): Hier wird dasselbe #d1 als Selektor für Tag-P-Inhalte verwendet. Wenn der Benutzer auf die Schaltfläche wird die Methode html() aufgerufen, die die Daten im HTML-Format zurückgibt.
  • alarm(“value: ” + $(“#d2”).val()):Es gibt den Wert des Eingabefelds auf dem Server zurück.
  • Alert($(“#d3”).attr(“href”)): Gibt den Attributwert für die Selektor-ID d3 zurück.

JQuery ajaxDemo abrufen

Wenn Sie das obige Beispiel ausführen, erhalten Sie die folgende Ausgabe: Jquery-ajaxGet-Example Jquery-ajaxGet-Example (1) Jquery-ajaxGet-Example (2) Jquery-ajaxGet-Example (3) Jquery-ajaxGet-Example (4)

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Nach oben scrollen