Menu
I have a html
index.html:
<html>
<head>
<title>Facebook</title>
<script type="text/javascript" src="../xdata/js/jquery.js"></script>
</head>
<body>
Tasks (<span id="tasks">0</span>)
Messages (<span id="messages">0</span>)
Notifications (<span id="notifications">0</span>)
<script type="text/javascript">
$(document).ready(function() {
var pagetitle = document.title;
document.title = pagetitle+' NEW NOTIFICATON';
});
</script>
</body>
</html>
and a xml file
page.xml:
<?xml version="1.0" ?>
<page tasks="1" messages="3" notifications="3"/>
How do i make that every 5 seconds index.html to read page.xml and modify the title like in faceboook ("(1) Facebook") and also modify tasks, messages, notifications ...
I'm having problems at reading the xml. If anyone can help me?
PS - I prefer jQuery ... but JavaScript works as well
474
The following was done in jquery, though you have a slight error with your xml file that lead to parsing issues.
Assuming your xml file is like this:
<?xml version="1.0"?>
<data>
<page tasks="1" messages="3" notifications="3"/>
</data>
The following code will modify the page accordingly, using jquery of course:
$(document).ready(function() {
function get_info() {
$.ajax({
type: "GET",
url: "page.xml",
dataType: "xml",
cache: false,
complete: function(doc) {
var tasks = $(doc.responseText).find("page").attr("tasks");
var msgs = $(doc.responseText).find("page").attr("messages");
var notes = $(doc.responseText).find("page").attr("notifications");
if (tasks != $('#tasks').text() ||
msgs != $('#messages').text() ||
notes != $('#notifications').text()) {
document.title = "Facebook" + ' NEW NOTIFICATON';
}
$('#tasks').text(tasks);
$('#messages').text(msgs);
$('#notifications').text(notes);
}
});
}
setInterval(function() {
get_info();
}, 5000);
});
I spent some time developing this, and I know for a fact it works.
177
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
