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

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

如何為嵌套數(shù)組元素指定一個(gè)類?

如何為嵌套數(shù)組元素指定一個(gè)類?

白衣非少年 2024-01-18 17:02:10
我有一個(gè) JSON,存儲(chǔ)在一個(gè)名為PhotographersInfo的變量中,我從那里獲取數(shù)據(jù),但我想要做的是:我想顯示與每個(gè)攝影師對(duì)應(yīng)的標(biāo)簽,并 為每個(gè)攝影師提供一個(gè)邊框!就像這張照片一樣結(jié)果 - 照片我使用模板文字來(lái)顯示 HTML 中的信息,目前我正在使用 join() 方法將元素轉(zhuǎn)換為字符串,但如何為每個(gè) TAG 提供邊框?這是我的代碼:photographersInfo.forEach((item) => {   const photographersDiv = document.getElementById('container');  const div = document.createElement("div");  photographersDiv.appendChild(div);  div.innerHTML = `    <div class="photographerContainer">        <div class="portraitBox">          <img src="${item.portrait}" alt="photo">        </div>        <h1 class="name">${item.name}</h1>        <p class="city">${item.city}, ${item.country}</p>        <p class="tagline">${item.tagline}</p>        <p class="price">${item.price}€/jour</p>        <p class="tags">${item.tags.join(" ")}</p>      </div>    `   });這是我的 JSON 數(shù)據(jù):let photographersInfo = [      {        "name": "Mimi Keel",        "id": 243,        "city": "London",        "country": "UK",        "tags": ["#portrait", "#events", "#travel", "#animals"],        "tagline": "Voir le beau dans le quotidien",        "price": 400,        "portrait": "/Photos/Portrait/MimiKeel.jpg"      },      {        "name": "Ellie-Rose Wilkens",        "id": 930,        "city": "Paris",        "country": "France",        "tags": ["#sports", "#architecture"],        "tagline": "Capturer des compositions complexes",        "price": 250,        "portrait": "/Photos/Portrait/EllieRoseWilkens.jpg"      },      {        "name": "Tracy Galindo",        "id": 82,        "city": "Montreal",        "country": "Canada",        "tags": ["#art", "#fashion", "#events"],        "tagline": "Photographe freelance",        "price": 500,        "portrait": "/Photos/Portrait/TracyGalindo.jpg"      },      {        "name": "Nabeel Bradford",        "id": 527,        "city": "Mexico City",        "country": "Mexico",        "tags": ["#travel", "#portrait"],        "tagline": "Toujours aller de l'avant",        "price": 350,        "portrait": "/Photos/Portrait/NabeelBrandford.jpg"      },
查看完整描述

1 回答

?
慕萊塢森

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

使用地圖:


${item.tags.map(d => `<span class="tag">$nhkv1sx5v02o</span>`).join(" ")}

其中 css 可能類似于:


.tag {

    border: 1px solid lightgray;

    border-radius: 20px; 

    padding: 5px;

}


查看完整回答
反對(duì) 回復(fù) 2024-01-18
  • 1 回答
  • 0 關(guān)注
  • 148 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號(hào)

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