Question

我有一个ul列表元素，其宽度随其中的文本而变化，并且会定期更改。现在我想将ul列表的宽度设置为第一个列表元素的宽度，这是可以更改的文本。我想“获取”第一个列表项（＃item1）的宽度，并将ul列表（#myList）的宽度“设置”为刚才提到的第一个列表项的宽度。我尝试了以下代码，但它不起作用：

<script type="text/javascript">
  var width = document.getElementById('item1').offsetWidth;
  document.getElementById('myList').style.width = width;
</script>

HTML：

<ul id="myList">
  <li id="item1">text1</li>
  <li>text2</li>
  <li>text3</li>
</ul>

有什么建议吗？我更喜欢不使用jquery，而是纯粹的javascript ...

谢谢！

Answer 1

使用此..在这里我假设ul元素是#ul而list元素是#list

 var liWidth=document.querySelector('#list').clientWidth;

 // make the width of ul same
 document.querySelector('#ul').style.width=liWidth+'px';

那应该是workk ..并且一定要在加载JavaScript之前创建元素，否则会抛出无法找到null属性的错误

使用Javascript获取和设置元素的宽度

1 个答案: