如何使用 Javascript 檢查頁面中的元素是否已存在？

Question

我正在使用 flask socketio 構建一個聊天應用程序。 所以我正在嘗試實現聊天歷史記錄，但我遇到的問題是，每當新用戶連接時，應用程序都會將聊天歷史記錄發送給新用戶以及舊用戶，從而導致舊用戶重復聊天記錄用戶。 我已經嘗試了所有服務器端，但我認為唯一的方法是通過 Javascript 客戶端。 有沒有什么辦法可以讓 Javascript 獲取聊天記錄時，我可以讓 JS 先檢查頁面上是否不存在該消息，然后再檢查 append 嗎？

這是正在發生的事情的屏幕截圖。 正在發生的事情的視覺表示

代碼（客戶端Javascript）

  const socket = io.connect("http://127.0.0.1:5000");

socket.on('connect', function() {

  socket.emit('sync_messages', {
    dname: "{{dname}}"
  });

});

代碼（服務器端Flask Socketio）

@socketio.on('sync_messages')
def handle_sync(data):
        socketio.emit('show_all_messages', messages)

代碼（又是客戶端）

socket.on('show_all_messages', function(data) {
 // console.log(data);
  len = data.length;
  for (i = 0; i < len; i++) {
    const newNode = document.createElement('div');
    newNode.innerHTML = data[i];
    document.getElementById('messages').appendChild(newNode);
  }

})

Answer 1

真的很簡單。 您可以為需要查找和執行的元素提供任何類型的屬性

function checkElement(){
   if(document.querySelector(/*Selector*/)){
      return true;
   }
   else{return false;}
}

然后只需在需要時調用此 function。 if 語句中的 document.querySelector 將自動查找您是否存在 html 元素