¿Cambiar la visualización de estilo de none a block en javascript?

Question

Aquí es código HTML fragmento

<li style="opacity: 1;"> 
    <a id="LinkDisplay" class="optionsDropDown" style="color:#FF0000;display:none" href="javascript:showThisLink('LinkId');"> 
</li> 

Aquí es función de jQuery que está siendo llamado a la carga

$(function() { 
    $.ajax({ 
     url: url, 
     dataType: 'json', 
     data: '', 
     type: 'POST', 
     success: function (data) { 
      alert("Test"); 
      document.getElementById("LinkDisplay").style.diplay="block"; // line 1 
      // after this line execution i should see the link as i have 
      // changed the link display from none to block but it is still invisible 
     }); 
    }); 
} 

Después de la línea 1 de ejecución, no estoy seguro de por qué mi vínculo no se hace visible?

Answer 1

dado que está utilizando jQuery usted podría escribir

$("#elemId").show() 

Answer 2

que no ha cambiado la propiedad de presentación en el código

document.getElementById("LinkDisplay").style.display="block" 

insertar este código en su función después de la línea 1

Answer 3

El padre li se establece en opacity: 0, lo que hace que sea transparente.

Deberá actualizar su 'opacidad a 1 para que sea visible.

Reemplazar esta:

document.getElementById("LinkDisplay").style.color = "#FF0000"; 

con esto:

$('#LinkDisplay').show().parent('li').css({opacity: 1}); 

La segunda línea es jQuery (ya que estás usando jQuery ya y es más fácil de encontrar el nodo padre) - se trata de encontrar la Vínculo LinkDisplay y cambiar el display: none al display: block, luego altera la opacidad del padre li para que sea visible.

Working jsFiddle

Answer 4

También parece que ya está usando jQuery por lo que puede simplificar un poco mediante el uso de la sintaxis del selector $:

$('#LinkDisplay').css('display', 'block') 

También es posible usar el método jQuery show de acortar la primera parte de este modo:

$('#LinkDisplay').show() 

el selector de jQuery puede encontrar elementos de identificación o clases utilizando el # de identificadores y . para las clases. El método jQuery css le permite obtener y establecer propiedades usando una variedad de métodos. Y el método jQuery parent le permite rápidamente desplazarse hacia arriba desde un elemento en el DOM para encontrar otras etiquetas.

Answer 5

Usando jQuery:

$('#LinkDisplay').css('display','block'); 
$('#LinkDisplay').parent().css('opacity','1'); 

Answer 6

El problema es la ortografía de pantalla en la línea:

document.getElementById("LinkDisplay").style.display="block";