使用 Jquery 交換 div ID

Question

我正在嘗試使用以下時間間隔交換 ID。

setInterval(
  function() 
  {
    $("#viewNext").attr("id","viewActual");
    $("#viewActual").attr("id","viewNext");
  }, 2000);

這確實有效，但只有一次。 間隔確實運行，但 Jquery 似乎在加載頁面時查看原始 ID。 Jquery 有沒有辦法查看 ACTUAL live id？

那么，為什么要這樣做呢？ 讓我澄清一下！ :) viewActual 是 viewNext 的“頂部”。 間隔在那里交換（和其他幾個 css 東西）。 當 viewActual 位於頂部時，我將下一個文件加載到 viewNext 中，以便在 2 秒（或任何其他時間）后交換時加載它。

完整代碼：

$('#viewContainer').append('<div class="viewBox" id="viewActual" style="height: '+screenWidth+'px; width: '+screenHeight+'px;"></div>');   
$('#viewContainer').append('<div class="viewBox" id="viewNext" style="height: '+screenWidth+'px; width: '+screenHeight+'px;"></div>');   

$("#viewActual").load('test/test1.php');
$("#viewNext").load('test/test2.php');

setInterval(
  function() 
  {
    $("#viewNext").attr("id","viewActual");
    $("#viewActual").attr("id","viewNext");
  }, 2000);

加載現在不起作用。 我知道。 但我確實知道間隔不起作用，因為我可以在 mozilla firefox 中看到它。 只要這不起作用，就沒有理由開發加載功能。

Answer 1

使用data-*屬性來存儲任何想要交換的字符串

 $('#viewContainer').append('<div class="viewBox" id="viewActual" data-swapid="viewNext"></div>'); $('#viewContainer').append('<div class="viewBox" id="viewNext" data-swapid="viewActual"></div>'); $("#viewActual").text('aaaaa'); $("#viewNext").text('bbbbb'); setInterval(() => { $('[data-swapid]').each((i, el) => { const data = el.dataset.swapid; // Cache data value el.dataset.swapid = el.id; // Swap ID into data el.id = data; // Set ID from cache }); }, 1000);

 #viewNext {color: red;}

 <div id="viewContainer"></div> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>