javascript getElementById for listStyle

Question

我不知道我在做什麼錯，但列表的項目符號不會改變，請幫助。

這是HTML

<div id="recetas_prepa"> 
<p class="recetas_preparacion">Preparación</p> 
<ul id="recetas_preparacion_lista"> 
    <li>Quitar aomo de 1 o 2 cm, salpimentándolas a continuación. 
    </li> 
    <li>En picado y la Mostaza Para CUando, removiéndolo todo. 
    </li> 
    <li>A de un poco de arroz blanco, unos champiñones o patatas hervidas. 
    </li> 
</ul> 
</div> 

這是CSS

#recetas_prepa{ 
    width:480px; 
    height:auto; 
    overflow:hidden; 
    background-color:lime; 
    clear:both; 
    margin-top:10px; 
    margin-left:20px; 
    margin-bottom:15px; 
} 
#recetas_preparacion_lista li{ 
    color:#333333; 
    font-family: Verdana, sans-serif; 
    font-size:10px; 
    text-align:left; 
    padding:8px 15px 0px 12px; 
    list-style:decimal inside none; 
} 

，這是我的JS：

<script language="javascript" type="text/javascript"> 
    function changeDiv() 
    { 
     var imgPath = new String(); 
     imgPath = document.getElementById("recetas_info").style.display; 

     if(imgPath == "inline" || imgPath == "") 
     { 
      document.getElementById("recetas_info").style.display = "none"; 
      document.getElementById("recetas_ingre").style.display = "none"; 
      document.getElementById("recetas_prepa").style.clear = "none"; 
      document.getElementById("recetas_prepa").style.width = "350px"; 
      document.getElementById("recetas_prepa").style.height = "90px"; 
      document.getElementById("recetas_preparacion_lista").style.listStyle = "disc inside none"; 
     } 
     else 
     { 
      document.getElementById("recetas_info").style.display = "inline"; 
      document.getElementById("recetas_ingre").style.display = "inline"; 
      document.getElementById("recetas_prepa").style.clear = "both"; 
      document.getElementById("recetas_prepa").style.width = "480px"; 
      document.getElementById("recetas_prepa").style.height = "auto"; 
     } 
    } 
</script> 

還有一些其他的東西存在，但在最後的如果，我的意思是這條線：

document.getElementById("recetas_preparacion_lista").style.listStyle = "disc inside none"; 

是一個不工作，我不知道爲什麼，它只是不會改變。

Answer 1

你應該你的CSS改變

#recetas_preparacion_lista li{ 
    color:#333333; 
    font-family: Verdana, sans-serif; 
    font-size:10px; 
    text-align:left; 
    padding:8px 15px 0px 12px; 
} 

，並添加

#recetas_preparacion_lista{ 
    list-style:decimal inside none; 
} 

您的代碼將現在的工作，因爲CSS是不那麼事實上重寫你的JavaScript解決，而在ul元素CSS地址li元素。

演示在http://jsfiddle.net/gaby/SHCYw/