js修改html不成功,为什么这段代码中用js修改css样式中的display属性却不成功？

getByClass() 这个方法写的有问题，你这个方法目的是获取className的元素数组。

var s = getByClass('li');     但是你用的是 li，是tagName

function changeshow(){

var p = getByClass('showmenu');   这里用的是className

p.style.display = "";    p是数组   jquery对象可以用数组.css();这样写，你这样写是错的

写一个循环，然后赋值，并且最好不要用“”，用block就行了。

}

noneshow  这个一样的错误

这是改好的

无标题文档

*{

marign: 0;

padding: 0;

}

.box{

width: 500px;

height: 100px;

margin: 0 auto;

}

li{

width: 50px;

height: 30px;

border: solid #000 1px;

float: left;

list-style: none;

margin-right: 15px;

}

.showmenu{

border: #000 solid 1px;

width: 200px;

display: none;

}

function getByClass(cls){

var eles = [];

var elements = document.getElementsByTagName('*');

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

if(elements[i].tagName.toLowerCase() == cls){

eles.push(elements[i]);

}

}

return eles;

}

window.onload = function(){

var s = getByClass('li');

var length = s.length;

for(var i=0; i

s[i].onmouseover = changeshow;

s[i].onmouseout = noneshow;

}

}

function changeshow(){

var p = document.getElementsByClassName('showmenu');

var length = p.length;

for(var i=0;i

p[i].style.display = "block";

}

}

function noneshow(){

var p = document.getElementsByClassName('showmenu');

var length = p.length;

for(var i=0;i

p[i].style.display = "none";

}

}

• 菜单1
• 菜单2
• 菜单3
• 菜单4
• 菜单5

鼠标经过li标签后应该显示的