###前提・実現したいこと
JavaScript初心者です。
Twitterのクライアントアプリを作っているのですが、
外部に用意したツイート表示用のHTMLをJavaScript(jQuery)で読み込んで、
名前・アイコン・テキスト(本文)の部分をAPIで取得したものに差し替えてから、
Bodyの指定した位置に挿入したいです。
例えば以下のような感じです。
ツイート表示用のHTMLは"template.html"、
名前・テキストのタグのIDはそれぞれ "tweet-name", "tweet-text" です。
HTML
1<!DOCTYPE html> 2 <head></head> 3 <body> 4 <div id="tweets-space"></div> <!-- ここに挿入したい --> 5 <script src="/node_modules/jquery/dist/jquery.min.js"></script> 6 <script> 7 function InsertTweets(tweets /*取得したツイートのリスト*/) { 8 let template = $('<div>').load("template.html"); 9 for(let i = 0; i < tweets.length; ++i) { 10 tweet_element = template.clone(); 11 // 名前・テキストを差し替える(ここが分からない) 12 tweet_element.find("#tweet-name").text(tweets[i].name) 13 tweet_element.find("#tweet-text").text(tweets[i].text) 14 $('#tweets-space').append(tweet_element[0]); 15 } 16 } 17 </script> 18 </body> 19</html>
###発生している問題
外部のHTMLを $('#hoge').load("fuga.html"); で読み込むところまでは出来たのですが、
読み込んだHTMLの特定の要素の属性・textを書き換える方法が分かりません。
そもそもforの中で要素をappendしても1つしか挿入されません。
そしてcloneしたものをconsole.log(cloned[0])で表示しても中身が空っぽのdivタグです。
APIで取得するところまではできていて、あとはHTMLで表示させるだけなので、
jQueryを使わない方法でもいいのでご教示下さい。よろしくお願いします。m(_ _)m
###補足情報(言語/FW/ツール等のバージョンなど)
jQueryのバージョンは3.2.1です。
webサーバーはFlask、クライアント側はelectronです。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/11/12 06:05