var clubs = ['Ajax', 'PSV', 'Feyenoord', 'NAC', 'FC Twente', 'FC Groningen', 'FC Utrecht'];
var add = document.getElementById('add');
var counter = 0;
document.getElementById('eredivisie').innerHTML = clubs;

function extraClubs () {
    if (counter == 1) {
        document.getElementById('eredivisie').disabled = true;  
    } else {
    clubs.push('Excelsior', 'Sparta', 'Vitesse');
    document.getElementById('eredivisie').innerHTML = clubs;
    counter++;
    }
};
add.addEventListener('click', extraClubs);

मेरे पास कुछ डच फुटबॉल क्लबों के साथ एक सरणी है और एक बटन दबाए जाने पर सरणी में कुछ फुटबॉल क्लब जोड़ने का कार्य है। दोनों ठीक काम करते हैं। एचटीएमएल में यह इस तरह दिखाता है:

अजाक्स, पीएसवी, फेनोर्ड, एनएसी, एफसी ट्वेंटे, एफसी ग्रोनिंगन, एफसी यूट्रेक्ट, एक्सेलसियर, स्पार्टा, विटेसे

मैं कैसे ठीक कर सकता हूं कि सरणी में प्रत्येक आइटम एक नई लाइन पर शुरू होगा?

3
Rooney 28 मार्च 2018, 20:40

4 जवाब

सबसे बढ़िया उत्तर

इस पंक्ति में, क्लब एक स्ट्रिंग में परिवर्तित हो जाते हैं:

  document.getElementById('eredivisie').innerHTML = clubs;

तो जेएस आपके लिए यह करेगा:

 clubs.toString()

और वह इसके बराबर है:

 clubs.join(",")

इसके बजाय अब वांछित परिणाम प्राप्त करने के लिए, हमें एक नई पंक्ति के साथ सरणी में शामिल होने की आवश्यकता है:

  clubs.join("<br/>")
2
Jonas Wilms 28 मार्च 2018, 17:43

नया ब्लॉक लेवल एलिमेंट बनाने और जोड़ने के लिए JavaScript का इस्तेमाल करें प्रत्येक सरणी आइटम के लिए। यह डिफ़ॉल्ट रूप से एक नई लाइन बनाता है।

//first clear old innerHTML then
var myText = document.createTextNode(item[i]);
var myDiv = document.createElement("div");
myDiv.appendChild(myText);
document.appendChild(myDiv)
0
Ronnie Royston 28 मार्च 2018, 18:10
  • आप अपनी टीमों को <p>team</p> के साथ लपेटने के लिए map फ़ंक्शन का उपयोग कर सकते हैं।
  • फिर, आपको फ़ंक्शन join का उपयोग करके मैप किए गए तत्वों में शामिल होने की आवश्यकता है।
var clubs = ['Ajax', 'PSV', 'Feyenoord', 'NAC', 'FC Twente', 'FC Groningen', 'FC Utrecht'];
var add = document.getElementById('add');
var counter = 0;
document.getElementById('eredivisie').innerHTML = clubs.map(s => '<p>' + s + '</p>').join('');

function extraClubs() {
  if (counter == 1) {
    document.getElementById('eredivisie').disabled = true;
  } else {
    clubs.push('Excelsior', 'Sparta', 'Vitesse');
    document.getElementById('eredivisie').innerHTML = clubs.map(s => '<p>' + s + '</p>').join('');
    counter++;
  }
};
add.addEventListener('click', extraClubs);
<button id="add"> ADD </button>
<p></p>
<div id="eredivisie"></div>
0
Ele 28 मार्च 2018, 17:44

प्रत्येक आइटम के बाद एक ब्रेक जोड़ देगा।

clubs.join("<br/>");
0
Jack 28 मार्च 2018, 17:43