Question

我有四个不同ID的div。我如何设置所有这些div的高度？

<div id="slide-1">a</div>
<div id="slide-2">b</div>
<div id="slide-3">c</div>
<div id="slide-4">d</div>

我知道我们可以在下面做这样的事情，但在此之前还有其他的div。

$('div').height($(window).height());

我想将这四个div单独设置为窗口高度。我不能在这里进行硬编码，因为幻灯片可能会有所不同。

Answer 1

这将选择其ID开头的所有div＆＃34; slide - ＆＃34;并将高度设置为窗口高度：

$('div[id^="slide-"]').height($(window).height());

Answer 2

$('div[id^="slide-"]').css("height", $(window).height() + 'px');

演示：

http://jsfiddle.net/463KU/1/

Answer 3

DEMO

    $('div').filter(function() { return /^slide-[1-4]$/.test( this.id ); })
    .height( $(window).height() );

Answer 4

如果你想增加特定div的高度，请使用class for multiple

<div class="divHeight" id="slide-1">a</div>
<div class="divHeight" id="slide-2">b</div>
<div class="divHeight" id="slide-3">c</div>
<div class="divHeight" id="slide-4">d</div>

$('.divHeight').height($(window).height());

Answer 5

我还建议你用这种方式获得窗户高度：

var windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;

<div class="divHeight" id="slide-1">a</div>
<div class="divHeight" id="slide-2">b</div>
<div class="divHeight" id="slide-3">c</div>
<div class="divHeight" id="slide-4">d</div>

$('.divHeight').height(windowHeight);

将div的高度设置为窗口高度

5 个答案: