第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會有你想問的

如何顯示 firebase 數(shù)據(jù)庫中的所有值并用 CSS 邊框分隔每個(gè)值?

如何顯示 firebase 數(shù)據(jù)庫中的所有值并用 CSS 邊框分隔每個(gè)值?

我想知道如何返回每個(gè) firebase 值,每個(gè)值都在 CSS 邊框內(nèi)。所以我有連接代碼和一切。但我想獲取“Post”中的所有值??匆幌麓a:var text = firebase.database().ref("text/");function post(){var newPost = document.getElementById('newPost').value;var p = document.getElementById('p');p.innerHTML = newPost;      text.set ({   Post: {     hertext: newPost        }       });}text.on("child_added", function(data, prevChildKey) {  var newPlayer = data.val();var p = document.getElementById('p');p.innerHTML = newPlayer.hertext;});<textarea id = "newPost"></textarea><button onclick = "post();">Post</button><p id = "p"></p>但是我如何將不止一個(gè)值放入數(shù)據(jù)庫中呢?使用我現(xiàn)在的代碼,最新的值只是替換了它之前的值。我如何制作它才能制作并顯示項(xiàng)目列表,而不僅僅是最后添加的項(xiàng)目?一旦它們都顯示在屏幕上,有什么辦法可以讓每個(gè)值單獨(dú)顯示并在其周圍加上 CSS 邊框?我在這里先向您的幫助表示感謝!
查看完整描述

1 回答

?
夢里花落0921

TA貢獻(xiàn)1772條經(jīng)驗(yàn) 獲得超6個(gè)贊

如果您想對Post數(shù)據(jù)庫中的每個(gè)節(jié)點(diǎn)應(yīng)用單獨(dú)的 CSS 樣式,則需要確保每個(gè)節(jié)點(diǎn)都Post以 HTML 中的單獨(dú)元素結(jié)束。


最簡單的方法是生成一個(gè)新的 HTML 元素,每次child_added都會觸發(fā):


text.on("child_added", function(data, prevChildKey) {

  var newPlayer = data.val();

  var p = document.getElementById('p');

  var span = document.createElement('span');

  span.innerText = newPlayer.hertext

  p.appendChild(span);

});

現(xiàn)在您可以對元素span下的每個(gè)元素應(yīng)用單獨(dú)的 CSS 樣式id。


如果你想在數(shù)據(jù)庫中存儲多個(gè)值,你需要添加它的push()方法而不是set():


text.push({

    hertext: newPost  

})

這會在其下生成一個(gè)新的所謂的推送 ID,/text然后在其中存儲您的新結(jié)構(gòu)。我已經(jīng)刪除了Post包裝紙,因?yàn)槲艺J(rèn)為可能不再需要它了。


查看完整回答
反對 回復(fù) 2023-05-25
  • 1 回答
  • 0 關(guān)注
  • 112 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號