I would like to know how I can only refresh a specific element in my website, instead of the whole web page? The element I'm talking about is a flash application that loads quite slow and may experience connection timeouts. I want to enable the user to only refresh that element/falsh app. How do i do that? Below I have an Ajax function that updates an HTML element but not sure how to apply it to my situation.
<head>
<script type="text/javascript">
function loadXMLDoc() {
var xmlhttp;
if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "ajax_info.txt", true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="myDiv">
<h2>Let AJAX change this text</h2>
</div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>
</body>
Try this:
function reload(){
var container = document.getElementById("yourDiv");
var content = container.innerHTML;
container.innerHTML= content;
//this line is to watch the result in console , you can remove it later
console.log("Refreshed");
}
<a href="javascript: reload()">Click to Reload</a>
<div id="yourDiv">The content that you want to refresh/reload</div>
Hope it works. Let me know
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With