Wie kann ich den Inhalt einer HTML-Seite dynamisch aktualisieren, ohne die Seite neu laden zu müssen?

HTML-Seiteninhalte dynamisch ändern

Das Aktualisieren von Webinhalten ohne Neuladen der Seite kann das Benutzererlebnis verbessern und die Website-Leistung verbessern. Um dies zu erreichen, können Sie AJAX (Asynchronous JavaScript and XML) in Verbindung mit HTML, PHP, JavaScript und jQuery verwenden.

Betrachten Sie das folgende Beispiel:

<a href="#" onClick="recp('1')">One</a>
<a href="#" onClick="recp('2')">Two</a>
<a href="#" onClick="recp('3')">Three</a>

<div>

Dieser Code zeigt Links an um verschiedene Inhalte aus einer Datenbank abzurufen. Anstatt die Seite neu zu laden, wenn auf einen Link geklickt wird, müssen Sie AJAX verwenden, um die Daten asynchron abzurufen und den Inhalt des „myStyle“-Divs zu aktualisieren, ohne die Seite zu aktualisieren.

Um dies zu erreichen, können Sie die verwenden Folgende JavaScript-Funktion:

<script type="text/javascript">
  function recp(id) {
    $('#myStyle').load('data.php?id=' + id);
  }
</script>

Diese Funktion verwendet die Methode „load()“ von jQuery, um den Inhalt aus einem separaten PHP-Skript („data.php“) abzurufen und den Inhalt des zu ersetzen „myStyle“ div mit den abgerufenen Daten.

Das PHP-Skript („data.php“) sollte den notwendigen Code enthalten, um den angeforderten Inhalt abzurufen und anzuzeigen:

require ('myConnect.php');     
$id = $_GET['id'];
$results = mysql_query("SELECT para FROM content WHERE  para_ID='$id'");   
if( mysql_num_rows($results) > 0 )
{
 $row = mysql_fetch_array( $results );
 echo $row['para'];
}

Indem Sie dies implementieren Mit diesem Ansatz können Sie Seiteninhalte dynamisch aktualisieren, ohne die Seite neu laden zu müssen, sodass Benutzer nahtlos auf Ihrer Website navigieren und bei Bedarf auf verschiedene Inhalte zugreifen können.

Das obige ist der detaillierte Inhalt vonWie kann ich den Inhalt einer HTML-Seite dynamisch aktualisieren, ohne die Seite neu laden zu müssen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!