javascript - 奇怪的clientHeight行为图像

我有一个在Firefox中工作的函数：

function widthimg() {
           var wheight = document.getElementById('recent-img1');
           console.log(wheight.clientHeight);
           document.getElementById('recent-img2').style.height = wheight.clientHeight +'px';
                    }

但chrome却没有，chrome根本不显示图像（高度为0的图像）。

奇怪的是，两个元素都是图像：

<div class="col-lg-6 col-sm-6 margin-top-60 zoominmouse">
  {{HTML::image('images/recentprojects1.png','recent',array('class' => 'img-responsive img-center image-popup-vertical-fit', 'id' => 'recent-img1')) }}
</div>
<div class="col-lg-6 col-sm-6 margin-top-60 zoominmouse" id="test">
  {{ HTML::image('images/pricing1.png','recent',array('class' => 'img-responsive img-center image-popup-vertical-fit', 'id' => 'recent-img2')) }}
</div>

因此，当firefox读取wheight.clientHeight的属性时，我想尝试一下：

function widthimg() {
           var wheight = document.getElementById('recent-img1');
           console.log(wheight.clientHeight);
           document.getElementById('recent-img2').clientHeight = wheight.clientHeight;
                    }

因为我现在将clientHeight传递给clientHeight，这对我来说很有意义，但这在两种浏览器中都不起作用。

所以我的三个问题是：

如何使该功能在chrome中运行？
为什么不能将clientHeight传递给clientHeight？
有可能用CSS使两个图像都达到img1的高度吗？

最佳答案

可以这样使用：

function widthimg() {
    var wheight = document.getElementById('recent-img1');
    console.log(wheight.clientHeight);
    document.getElementById('recent-img2').clientHeight = wheight.clientHeight;
    console.log(document.getElementById('recent-img2').clientHeight);
             }

<body onload="widthimg()">
// rest of your html
</body>

关于javascript - 奇怪的clientHeight行为图像，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/27263212/