0

我正在做一个Chrome扩展,改变鸣叫 我检索的文本,然后用更改文本

var tweets = document.getElementsByClassName('js-tweet-text tweet-text'); 
for (var i = 0, l = tweets.length; i < l; i++) { 
    tweets[i].innerText = 'Some text'; 
} 

改变.js文件的鸣叫文本已加载的鸣叫当页面加载更改为“某些文本”,但是当我向下滚动时,加载的新推文不会更改。 如何更改新的tweets文字?

编辑: 我尝试添加一个计时器:

var tweets = document.getElementsByClassName('js-tweet-text tweet-text'); 
var timer = setInterval(changeTexts, 1000); 

function changeTexts() { 
for (var i = 0, l = tweets.length; i < l; i++) { 
    tweets[i].innerText = 'Some Text'; 
} 
} 

但加载在HTML中,所有的微博,我想只是修改而不是修改已经修改了那些新的。

回答

0

卢克,使用MutationObserver

var root = document.querySelector('#fTweets'), 
 
    tweetBody = document.querySelector('#fTweetBody'), 
 
    sendBtn = document.querySelector('#fSendBtn'), 
 
    
 
    pushTweet = _ => root.insertAdjacentHTML('beforeend', `<div class='fTweet'>${tweetBody.value}</div>`); 
 
sendBtn.addEventListener('click', e => pushTweet()); 
 

 
// This function changes the new tweet 
 
let editTweet = e => e.innerHTML += '| Edited by me'; 
 

 
// Immediately after loading change downloaded tweets 
 
// Do not forget about the availability of DOM 
 
Array.from(root.children).forEach(e => editTweet(e)); 
 

 
// Create a MutationObserver instance 
 
new MutationObserver(function(mutations) { 
 
    // We process all the changes of the root node 
 
    mutations.forEach(mutation => { 
 
    // If this change units, then send a new node for processing 
 
    // Note: There is no inspection, that to this example, but be sure to check what and where nodes are in real code 
 
    if(mutation.type === 'childList'){ 
 
     mutation.addedNodes.forEach(item => editTweet(item)); 
 
    } 
 
    }); 
 
}).observe(root, {childList: true});
<div id='fTweets'><div class='fTweet'>First tweet...</div></div><hr /> 
 
<textarea placeholder='Your tweet...' id='fTweetBody'></textarea><br /> 
 
<input type='button' id='fSendBtn' value='Send' />