0

i am displaying list of items using java script using check box here i used li[i].style.display=' ' and li[i].style.display='none' what is the difference between them?

men=[1,2,3,4,5];
        women=[12,23,34,45];
        children=[123,234];
        for(i=0;i<men.length;i++){
            document.getElementById("userlist").innerHTML+="<li class='li-men' style='display:none'>"+men[i]+"</li>";
        }
        document.getElementById("checkbox1").onchange=function(){
            var li=document.getElementsByClassName('li-men');
            for(i=0;i<li.length;i++){
                if(document.getElementById("checkbox1").checked){
                    li[i].style.display='';
                }
                else{
                    li[i].style.display='none';
                }
            }
        }
31piy
  • 23,323
  • 6
  • 47
  • 67
sukumar
  • 37
  • 1
  • 8
  • Read this for all valid values of display https://www.w3schools.com/jsref/prop_style_display.asp – PSK Mar 19 '18 at 08:59
  • `.display=' '` when you set blank to display property it assign itself the default property, `.display='none'` when you set 'none' the element will be hidden – Azad Mar 19 '18 at 08:59
  • Possible duplicate: https://stackoverflow.com/questions/7420109/what-does-style-display-actually-do – Mamun Mar 19 '18 at 08:59

1 Answers1

0

style.display='' is an invalid CSS property and as such, ignored by the CSS engine. Therefore, it defaults to display="block" that does display the element. So it does what you expect it to do, but it's not clean.

Jeremy Thille
  • 26,047
  • 12
  • 43
  • 63