How can AJAX be utilized to reload only the text in a <div> without refreshing the entire page?

To reload only the text in a <div> without refreshing the entire page using AJAX, you can make an AJAX request to a PHP file that returns the updated text content. This PHP file should fetch the updated text from a database or any other data source and echo it back. Then, the AJAX success function can update the <div> content with the received text without reloading the page. 

// HTML file with the &lt;div&gt; element
&lt;div id=&quot;content&quot;&gt;&lt;/div&gt;

// jQuery AJAX request to fetch updated text
$.ajax({
    url: &#039;update_text.php&#039;,
    type: &#039;GET&#039;,
    success: function(response) {
        $(&#039;#content&#039;).html(response);
    },
    error: function() {
        console.log(&#039;Error fetching updated text&#039;);
    }
});

// update_text.php file
&lt;?php
// Fetch updated text from database or any other source
$updatedText = &quot;New Text Content&quot;;

// Echo the updated text
echo $updatedText;
?&gt;

Keywords

AJAX PHP <div> reload text

Related Questions