TwitterのタイムラインからTweet要素を取得する
タイムラインの要素をWebインスペクタでパット見てもイマイチわからないtakumin.icon
しかしタイムライン中のTweet要素は以下のClassを持っている
"tweet"
"js-stream-tweet"
"js-actionable-tweet"
エトセトラ
これを元にFilterを作るとページ中のTweet要素だけ取得できる
code:getTweetElems.js
const tweetElms = Array.from(document.body.querySelectorAll('*'));
.filter( item => {
return item.classList.contains('tweet') && item.classList.contains('js-stream-tweet')
});
console.dir(tweetElems);
//コンソールにArray(20)みたいな感じで要素が列挙される
しかもこのtweetElemsの中には本文のみならず投稿者名やID、フォロー・ブロック情報も含まれている
さらにスクロールによって追加された新しい要素も取り込みたい
新しい要素が取り込まれるとタイムラインのDOMが変更される
code:addLazyLoadedElems.js
const streamItem = document.getElementById("stream-items-id");
const observer = new MutationObserver(records => {
records.forEach(record => {
Array.from(record.addedNodes)
.forEach(node => {
const tweetNode = node.firstElementChild
tweetElms.push(tweetNode);
})
})
})
const observeOption = {childList: true}
observer.observe(streamItem, observeOption);
この方法ならばTwitterAPIを用いずにタイムラインを取得できる
昨今のTwitterは開発者を締め出しにかかっているので正道ではないが有用takumin.icon