未捕获TypeError：无法设置未定义属性'Width'

Question

我在我的网站中动态设置ul元素的宽度时出现问题。

下面是jQuery的我uusing

var button = $("#navbar"); 
alert(button); 
var count = $("#header li").length; 
alert(count); 
$("#navbar").style.Width = count * 110 

这里的HTML

<div id="header" class="clearfix"> 
    <div class="clearfix hidden"> 
     <img src="/Content/Images/main-logo.png"> 
    </div> 
    <div id="navbar"> 
     <ul> 
      <li id="home"> 
       home 
      </li> 
      <li id="portfolio"> 
       portfolio 
      </li> 
      <li id="about"> 
       about 
      </li> 
     </ul> 
    </div> 
</div> 

“警报（按钮）” 返回[对象对象]，所以它不是空的（至少我的理解），但每当我尝试设置它的宽度时，我都会在标题中看到错误。

任何人都知道我在做什么错了？

Answer 1

您必须使用下面的代码

$("#navbar")[0].style.width = count * 110 

或

$("#navbar").width(count * 110) 

因为style是DOM元素的属性之一，而$("#navbar")是一个jQuery对象，它不包含默认为style属性。

Answer 2

style是一个DOM属性，但不是jQuery对象的属性。如果你想使用jQuery设置宽度，你可以直接使用css getter/setter或width function。

$("#navbar").width(count * 110); 
$("#navbar").css('width', (count * 110) + "px"); 

Answer 3

您正在使用$("#navbar")开发jQuery元素。如果你想使用香草JavaScript来设置宽度：

$("#navbar")[0].style.width = count * 110 //note that the width property is not capitalized 

或者使用jQuery的width方法：

$("#navbar").width(count * 110);