如何通過ajax不斷更新內容時更新持久性javascript？

我有一個通過ajax更新的網頁。它每隔1分鐘加載更新的新聞饋送。我想要做的是創建一個JavaScript來檢測傳入的日期字段，並在其周圍放置一個強大的標籤。以下是獲得通過飼料的HTML樣本：如何通過ajax不斷更新內容時更新持久性javascript？

<div class="results"> 
    <div class="article"> 
    <div class="date">jan 8, 2013</div> 
    <p>Some content here</p> 
    </div> 
    <div class="article"> 
    <div class="date">feb 8, 2013</div> 
    <p>Some content here</p> 
    </div> 
</div>

我可以寫，更新它的基本的JavaScript，但它只能觸發一次。如果在「結果」元素中發生了任何變化並且相應採取行動，我該如何去做javascript檢測。

來源

2013-10-24 Patoshi パトシ

那麼，如果你有控制更新DOM的代碼應該是非常簡單的，不是嗎？我在這裏看不到問題。而「檢測傳入日期字段」是什麼意思？如果你想設置日期的樣式，你可以添加一個CSS規則......'.date {font-weight：bold; } – plalx

只是一個例子。我想自定義一個網站，我確實控制了代碼。我基本上想寫一個JavaScript代碼來檢測今天的日期，然後在它上面加上一個強大的標籤。但DOM自從通過ajax加載後不斷更新。 –

如果你想要回答你的問題，你應該顯示你的ajax調用和你的DOM更新代碼。 – plalx

你能附加一個偵聽阿賈克斯（無論是.complete（）或.ajaxStop（）），然後讓所有日期並將它們與今天的日期進行比較。如果它們匹配，則使日期加粗。類似這樣的：

$(document).ajaxStop(function() { 
    var today = new Date(); 

    $.each($('.article .date'), function(i, el){ 
     var el_text = el.text(); 
     if(el_text == today.toLocaleFormat('%b %d, %Y')) { 
      el.html('<b>' + el_text + '</b>'); 
     } 
    }); 
});

來源

2016-10-04 14:35:45

如果您使用JQuery（您應該使用jquery標記標記您的問題），那麼您需要使用$.ajaxComplete這樣的解決方案。如果您使用其他框架，還有其他方法可以對此進行類似的處理。

$(document).ajaxComplete(function() { 
 
    $(".results .date").each(function() { 
 
    var strong = $('<strong>').text($(this).text()); 
 
    $(this).empty().append(strong); 
 
    }); 
 
}); 
 

 
// for this test, only to demonstrate, manually trigger an ajax complete event 
 
function test() { 
 
    $(document).trigger('ajaxComplete'); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="results"> 
 
    <div class="article"> 
 
    <div class="date">jan 8, 2013</div> 
 
    <p>Some content here</p> 
 
    </div> 
 
    <div class="article"> 
 
    <div class="date">feb 8, 2013</div> 
 
    <p>Some content here</p> 
 
    </div> 
 
</div> 
 
Test: <button onclick="test()">Trigger JQuery Ajax Complete Event</button>

檢測結果的變化，唯一的辦法就是要麼A）使基於此結果說，它承諾它的新的或B中的假設）比較它到以前的版本。您可以使用$.ajaxSend來存儲方法B的更改。

如果您採用方法A，您可以跟蹤最大日期，並且只在日期較大時執行某些操作，然後使用該日期更新最大日期。

來源

2016-09-28 03:34:31 TylerY86

如果您不想使用Ajax成功回調，那麼您可以使用DOMSubtreeModified事件。例如

$('div.results').bind("DOMSubtreeModified", function() { 

     alert('changed'); 
});

當div.result的內容發生改變時，這將被觸發。 INT本次活動，你將能夠做任何你想要的操作與div.date

來源

2016-09-28 09:03:43

這已被棄用，取代突變觀察者https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Mutation_events –

如何通過ajax不斷更新內容時更新持久性javascript？

回答

相關問題