Question

我真的不知道怎么解释这个，但我会尽我所能。

我有一个div（例如用500px修复），我希望内容在它们之间“平分”。

我该怎么做呢？

目前，孩子们只需要花费他们所需要的数量，并且他们不会放大以填充所有人可用的宽度的100％。

Answer 1

你可以这样做：

function getIndividualWidth(elementId,childrenCount){
 var div = document.getElementById(elementId);
 var totalWidth = div.offsetWidth;//500
 //calculating childrenCount would require a function
 //if you were not keeping track of it
 return parseInt(totalWidth / childrenCount);
}

这是计算div的子元素的一种方法

function getChildElementCount(element){
 var childCounter = 0;
 var startPoint = element.childNodes;
 for (var child in startPoint) {
  if (startPoint[child].nodeType != 1) continue; //not an element
  childCounter++;
 }
 return childCounter;
}

哪个会将功能改为：

function getIndividualWidth(elementId){
 var element = document.getElementById(elementId);
 var totalWidth = element.offsetWidth;//500
 return parseInt(totalWidth / getChildElementCount(element));
}

决定何时使用它取决于元素在屏幕上的呈现方式。如果你已经渲染它们，并且只想从某个父级开始，你可以这样做：

html（跨度为内联元素，因此需要display:inline-block才能实际反映宽度的变化）请参阅此处的jsfiddle：http://jsfiddle.net/uhejM/

<div id="parent" style="width:500px;">
 <span>1</span>
 <span>2</span>
 <span>3</span>
 <span>4</span>
</div>

JS

function getIndividualWidth(element){
 return parseInt(element.offsetWidth / getChildElementCount(element));
}

function EqualizeChildWidths(element){
 var width = getIndividualWidth(element);
 var startPoint = element.childNodes;
 for (var child in startPoint) {
  if (startPoint[child].nodeType != 1) continue; //not an element
  startPoint[child].style.width = width + "px";
 }
}    

EqualizeChildWidths(document.getElementById("parent"));

Answer 2

如果我理解你的问题，请正确使用JQuery：

$('.inner').each(function(){

$(this).width(($('#fixed').width() / $('.inner').size()));

})

将内部对象浮动到左侧 - 可以使用绝对左侧和更多的jquery代码。

http://jsfiddle.net/Q57xC/3/

根据其他孩子调整div的宽度？

2 个答案: