Javascript 删除子元素（如果为“”）；削减；按隐藏溢出的父元素

我正在制作一个页面，左侧应该有内容，右侧应该有广告。左侧div的高度未知。我想在右侧添加尽可能多的商业div，而不会使右侧的高度高于左侧

我将右侧div高度设置为左侧高度，然后在右侧div上添加了

overflow:hidden

，以便切断商业div。我不想我的商业部门被切断，所以我想删除一个被切断的部门

---

这是我的代码

像这样的东西应该可以做到这一点

$（文档）.ready（函数（）{
$（“.right_side”）.css（“height”，$（.left_side”）.height（））；
变量j=$（“.right_side”）.子项（“div”）.长度；
对于（变量i=1；i
div.left\u侧{
显示：内联块；
}
右侧分区{
显示：内联块；
浮动：对；
溢出：隐藏；
}
分区左侧内容{
高度：30px；
边缘顶部：10px；
背景颜色：绿色；
}
广告部{
高度：50px；
边缘顶部：10px；
背景色：森林绿；
}

内容
内容
广告
广告
广告
广告
广告
广告
您可以尝试以下代码，这将删除所有被切断的商业广告DIV：

$(document).ready(function() {
   $(".right_side").css("height", $(".left_side").height());
   $commercialDivs = $(".right_side").children("div.commercials");
   $rightSideDivHeight = $(".right_side").height();
   $tempHeight = 0;
   for(var i=0;i<$commercialDivs.length;i++){
        $tempHeight += $commercialDivs[i].clientHeight;
    if($tempHeight>$rightSideDivHeight){
        $commercialDivs[i].remove();
    }
   }   
 });

$（文档）.ready（函数（）{
$（“.right_side”）.css（“height”，$（.left_side”）.height（））；
$commercialDivs=$（“.right_side”）。儿童（“div.commercials”）；
$rightSideDivHeight=$（“.right_side”）.height（）；
$tempHeight=0；
对于（变量i=0；i$rightSideDivHeight）{
$commercialDivs[i].remove（）；
}
}   
});
如果我不添加更多的广告，效果很好。增加更多的商业部门使它无法再次发挥作用。乌普西，这很有效。我忘了保存索引（）谢谢你的回答！如果我不添加更多内容，效果会很好。这是因为在计算TEMPH8时，我没有考虑商业广告的10px的保证金。请加10，它会起作用。i、 e.
$commercialDivs[i].clientHeight+10