I’m new to AJAX and PHP but I know that PHP is a server-side scripting language and so there will not be any changes to the html unless the user refreshes the page or the user submits a form. Therefore I suppose the change of the number in <span id="mercurymessagesCountValue"> when a facebook user receives a message

is AJAX-related.
And this is my guess:
The change of the number is triggered when it is detected that another user [the sender] has inserted a new row into a particular table and each column contains different data: the time, the message, the sender id and the receiver id.
So here’s my question… In this case, how is the changes in the database detected and how does it trigger a javscript [or something else] to make changes to the html? Or if I’m wrong… can I know how Facebook does that? Thanks very much!!
Let me clear a few things up for you here,
AJAX is simply a type of request being sent by the browser to go grab data from another page dynamically. In facebook’s case, they actually have a special type of connection to the client computer to keep the page ‘alive’. This way, they can push dynamic updates to the client without the need to constantly poll/refresh a single page on the server (would make large amounts of load).
So, let’s just pretend, they are constantly refreshing the page on the server to determine how many notifications are unread –
Client -> Ajax Call -> Server PHP Page -> Ajax Return -> Client
So, in order, the client sends a request for the page to be generated by the server.
The server’s php page will then count the number of ‘unread’ notification rows in the database for that particular user. It will then output the number of unread rows in plain html.
The client then recieves this plain HTML from the Ajax call, and simply updates the DOM with the new number of unread notifications
PLEASE NOTE: This is not how facebook works, but it’s a good example of how to set up your own basic notification system if you are new to dynamic coding.