Javascript：在 for 循环中编辑图像高度答案

【问题标题】：Javascript: edit an images height in a for loopJavascript：在 for 循环中编辑图像高度
【发布时间】：2013-10-07 08:59:09
【问题描述】：

我正在尝试编辑在 javascript 的 for 循环中重复的图像高度，但我不知道需要在哪里添加它。

如果重要的话，这里是变量：

        var i;
        var start = 1;
        var seg = document.getElementById("selSegs").value;
        var parent = document.getElementById("divInch"), //parent for appendChild 
                imagePath = 'InchwormSegment.gif', //variable for image
                img; //adding img element

这是我的循环：

for(i = start; i<=seg; i++) {

            img = new Image(); //creating new image object
            img.src = imagePath; // element src = imagePath
            img.style.height = "215px"; // sets the height of all in loop
            // img.style.height = (img.style.height * .9) + "px"; - does nothing
            parent.appendChild(img); //appendChild adds another child (img) object
        }

我尝试添加一些数学，但我就是不知道它应该去哪里

【问题讨论】：

您是否尝试在每次迭代时减小或增加图像的高度？因为现在图像高度将保持在 215px
@samrap 我正在尝试降低图像的高度

标签： javascript for-loop

【解决方案1】：

如果这个小提琴完成了你想做的事情，请告诉我：http://jsfiddle.net/AyNY5/。需要记住的几点：

可以直接编辑图片的“height”属性，不需要经过style（甚至不需要加px！）
不要使用 new Image() - 使用 document.createElement('img')。这是 W3C 支持的标准。

如果我离开了，请告诉我 - 否则，你是在正确的轨道上！

小提琴中的JS代码：

var parent = document.getElementById("imgholder")

for (i=0;i<3;i++) {
    var img = document.createElement('img');
    img.src = "http://bit.ly/1975WKA"
    img.height = "200"
    parent.appendChild(img)
}

【讨论】：

这行得通，但我想我忘记了第一个片段之后的每个片段都必须是前一个片段的 90%。我想如果我做了 x = x * .9 它会起作用，但什么也没出现。这是我尝试过的东西的 jsfiddle，但它不起作用，因为它不是乘以高度本身，而是乘以图像的数量：jsfiddle.net/jATk4
我明白了。也许这更符合您正在寻找的内容：jsfiddle.net/AyNY5/3。我看到了 For 循环范围之外的 imgHeight 变量，然后每次迭代应用 0.9。它不是那么干净，但希望它有所帮助！
是的！谢谢你的帮助，我想我只是把它复杂化了，因为我过去做过，只是把我的脚本弄得乱七八糟，错过了订购。
别担心！如果对你有帮助，请采纳答案:)

【解决方案2】：

此时图像没有分配style.height。不过它确实有height 属性。

代替

img.style.height = (img.style.height * .9) + "px";

试试

img.style.height = (img.height * .9) + "px";

【讨论】：