Question

我试图动态地设置图片的高度（P2）取决于另一张图片（P1）的高度：

<script>
    function resizeElementHeight(element) {
        var P1 = document.getElementById('P1');
        var P2 = document.getElementById('P2');
        if(P1.height != P2.height) {
            P2.height = P1.height + "px";
        }
    }
</script>

基本上我想说＆＃34;如果图片P1的高度不同于图片P2的高度，设置P2的高度与P1＆＃34相同;但它不起作用。

你能帮帮我吗？谢谢。

Answer 1

您需要使用setAttribute方法，而不是P2.height。同样适用于P1.height，您必须使用getAttribute方法。

所以P2.setAttribute('height', ... );

如果您需要更多指导，请与我们联系。

Answer 2

除非您的HTML中包含height属性，否则您无法得到它。如果使用纯JavaScript，你必须做这样的事情：

//<![CDATA[
var doc = document, bod = doc.body, IE = parseFloat(navigator.appVersion.split('MSIE')[1]);
bod.className = 'js';
function gteIE(version, className){
  if(IE >= version)bod.className = className;
}
function E(e){
  return doc.getElementById(e);
}
function getPropertyFrom(p, e){
  return getComputedStyle(e).getPropertyValue(p) || e.currentStyle[p];
}
E('P2').style.height = getPropertyFrom('height', E('P1'))+'px';
//]]>

jQuery就像：

//<![CDATA[
$('#P2').css('height', $('#P1').height()+'px');
//]]>

在一个窗口上调整大小，用纯JavaScript：

onresize = function(){
  E('P2').style.height = getPropertyFrom('height', E('P1'))+'px';
}

窗口在jQuery中调整大小：

$(window).resize(function(){
  $('#P2').css('height', $('#P1').height()+'px');
});

注意：您应该使用外部JavaScript，因此它被缓存。纯JavaScript中的window是隐式的，因此您无需编写window.onresize = function(){}，window.document，window.open()等。如果需要，请在引用window对象时离开window。

设置图片高度取决于另一个图片高度

2 个答案: