जावास्क्रिप्ट में उल और ली तत्व बनाएं।

मैं जावास्क्रिप्ट का उपयोग कर अपने कोड में उल और ली तत्व बनाने की कोशिश कर रहा हूं। मैं निम्नलिखित है:जावास्क्रिप्ट में उल और ली तत्व बनाएं।

var test=document.createElement('section'); 
test.setAttribute('id','test'); 

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


document.body.appendChild(test); 
test.appendChild(ul); 

for (var i=0; i<array.length; i++){ 

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

    ul.appendChild(li); 
    li.innerHTML=li.innerHTML + array[i]; 

}

मेरे सरणी php से json_encode का उपयोग कर

array[0]='aaa'; 
array[1]='bbb'; 
array[2]='ccc';

सीएसएस

section { 

    display: block; 
    width: 200px; 
    margin: 50px auto; 
    border: 3px solid red; 

}

सब कुछ पार्स किया गया है को छोड़कर सूची शैली डॉट मेरी खंड टैग के बाहर है ठीक काम करता है।

यह क्रोम और आईई में इस तरह प्रदर्शित करता है लेकिन फ़ायरफ़ॉक्स ठीक काम करता है।

------------- 
*| aaa  | 
*| bbb  | 
*| ccc  | 
-------------

मैं अपने अनुभाग टैग के अंदर अपना डॉट चाहता हूं। कोई विचार है? बहुत बहुत धन्यवाद।

<!DOCTYPE html> 
<html> 
<head> 
<style> 
    ul#proList{list-style-position: inside} 
    li.item{list-style:none; padding:5px;} 
</style> 
</head> 
<body> 
    <div id="renderList"></div> 
</body> 
<script> 
    (function(){ 
     var ul = document.createElement('ul'); 
     ul.setAttribute('id','proList'); 

     var t, tt; 
     productList = ['Electronics Watch','House wear Items','Kids wear','Women Fashion']; 

     document.getElementById('renderList').appendChild(ul); 
     productList.forEach(renderProductList); 

     function renderProductList(element, index, arr) { 
      var li = document.createElement('li'); 
      li.setAttribute('class','item'); 

      ul.appendChild(li); 

      t = document.createTextNode(element); 

      li.innerHTML=li.innerHTML + element; 
     } 
    })(); 
</script> 
</html>

काम कर jsfiddle उदाहरण here

स्रोत

2012-07-05 Rouge

'सूची-शैली-स्थिति: अंदर' का उपयोग करने का प्रयास किया? –

लॉल यह काम करता है। इतना ही आसान। अनुमान लगाओ क्रोम और आईई की जरूरत है। बहुत बहुत धन्यवाद। – Rouge

यह मेरे बिना काम करता है - http://jsfiddle.net/XepXZ/1 – Alnitak

गोली स्थिति CSS संपत्ति list-style-position का प्रयोग करें

var list = []; 

var text;

समारोह अद्यतन() { console.log (सूची);

for (var i = 0; i < list.length; i++) { 

console.log(i) 

    var letters; 

    var ul = document.getElementById("list"); 

    var li = document.createElement("li");

li.appendChild (document.createTextNode (सूची [i]));

ul.appendChild (li);

अक्षरों + = "

" + सूची [i] + "

"; }

document.getElementById ("सूची")। आंतरिक HTML = अक्षर;

समारोह myfunction() {

text = prompt("enter TODO"); 

list.push(text); 

update();

}

स्रोत

2012-07-05 19:26:27 xandercoded

यहाँ मेरे कार्य कोड है:

स्रोत

2015-08-07 09:03:28

धन्यवाद ... इसकी वास्तव में मदद –

स्वागत ब्रो .... –

मेरा उत्तर

मेरा मतलब:

list-style-position:inside /* or outside */;

स्रोत

2016-12-24 10:06:18 sanjar

महान तो। आइए एक साधारण फ़ंक्शन बनाएं जो एक सरणी लेता है और एक div टैग के अंदर हमारी ऑर्डर की गई सूचीदृश्य/सूची प्रिंट करता है।

चरण 1: मान लीजिए कि आपके पास "contentSectionID" आईडी वाला div है।<div id="contentSectionID"></div>

चरण 2:

function createList(spacecrafts){ 

var listView=document.createElement('ol'); 

for(var i=0;i<spacecrafts.length;i++) 
{ 
    var listViewItem=document.createElement('li'); 
    listViewItem.appendChild(document.createTextNode(spacecrafts[i])); 
    listView.appendChild(listViewItem); 
} 

return listView; 
}

चरण 3:: उसके बाद हम हमारी जावास्क्रिप्ट समारोह है कि एक सूची घटक वापस आती है और एक सरणी में ले जाता है बनाने के अंत में हम अपने div चुनें और इसे में सूचीदृश्य बनाएँ:

document.getElementById("contentSectionID").appendChild(createList(myArr));

स्रोत

2017-08-10 05:57:52 Oclemy

जावास्क्रिप्ट में उल और ली तत्व बनाएं।

उत्तर

संबंधित मुद्दे