在現代網頁開發中，按鈕的點擊次數統計往往是我們關注的一個重要指標。通過統計按鈕的點擊次數，我們可以了解到用戶對于不同按鈕的偏好，進而優化頁面設計和內容推薦。為了實現按鈕點擊次數的準確統計，我們可以利用AJAX技術來實時更新數據，并通過后臺服務器將數據保存下來。

假設我們有一個網頁上放置了三個按鈕，分別是“喜歡”、“不喜歡”和“分享”。我們希望實時統計每個按鈕的點擊次數，并將數據發送給服務器進行保存。首先，在頁面加載時，我們為每個按鈕綁定一個點擊事件，并在點擊事件觸發時發送AJAX請求更新數據。

<button id="like-btn">喜歡</button>
<button id="dislike-btn">不喜歡</button>
<button id="share-btn">分享</button>
<script>
// 綁定按鈕點擊事件
document.getElementById("like-btn").addEventListener("click", function() {
updateClickCount("like-btn");
});
document.getElementById("dislike-btn").addEventListener("click", function() {
updateClickCount("dislike-btn");
});
document.getElementById("share-btn").addEventListener("click", function() {
updateClickCount("share-btn");
});
// 更新點擊次數
function updateClickCount(btnId) {
var xhr = new XMLHttpRequest();
xhr.open("POST", "/updateClickCount", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
// 發送請求
xhr.send("btnId=" + btnId);
}
</script>

上述代碼中，我們分別給每個按鈕綁定了一個點擊事件，并在事件處理函數中調用了updateClickCount函數。該函數創建了一個XMLHttpRequest對象，通過POST方式發送請求給服務器的/updateClickCount路由。在請求頭中設置了Content-Type為application/x-www-form-urlencoded，同時通過send方法發送按鈕ID給服務器。

后臺服務器端的代碼可以根據不同的后端語言編寫，例如使用Node.js的Express框架：

app.post("/updateClickCount", function(req, res) {
var btnId = req.body.btnId;
// 在數據庫中更新點擊次數
// ...
res.sendStatus(200);
});

在服務器端，我們通過接收到的請求參數btnId更新數據庫中對應按鈕的點擊次數。這里只是一個簡單的示例，實際項目中可能涉及更多的邏輯處理。最后，向客戶端返回狀態碼200表示請求成功。

通過上述的代碼，我們實現了通過AJAX獲取按鈕點擊次數并實時更新到服務器的功能。我們可以通過定期查看服務器端的數據來統計每個按鈕的點擊次數，從而進行相應的優化。例如，我們發現“喜歡”按鈕的點擊次數最多，那么我們可以優化頁面的內容和布局來強調這個按鈕，提高用戶的點擊率和轉化率。

總之，使用AJAX技術實現按鈕點擊次數的統計是現代網頁開發中常見的一項技術。通過實時更新數據，并結合后臺服務器的處理，我們可以獲得準確的按鈕點擊次數，為頁面優化和內容推薦提供參考依據。