Javascript 尝试设置4幅图像的宽度和高度，但只有一幅有效；其他的被跳过。ID彼此不同

我试图用四个半椭圆形来创建一个完整的椭圆形，这样我就可以增加或减少椭圆形的大小，并从中心而不是从一侧增加或减少大小。我发现其他代码声称对单个图像执行此操作，但每次都发现这是一个错误的声明。使用四个图像并设置它们在各自方向上调整大小似乎是唯一的方法。当实施我能做到的时，我可以看到它会起作用。我只是遇到了一个问题，javascript想要挑剔，根本不想为所有四个图像的大小设置属性，但是第一个图像的属性是设置的，当我切换顺序时，我可以看到每个图像将单独工作，但不是一次全部工作。另外，仔细看，我确实对所有这些都使用了不同的ID

以下是不想工作的代码：

WI=100
spillHi=25
document.getElementById（“widthTR”）.setAttribute（“width”，spillWi）
document.getElementById（“heightTR”）.setAttribute（“height”，spillHi）
document.getElementById（“widthBR”）.setAttribute（“width”，spillWi）
document.getElementById（“heightBR”）.setAttribute（“height”，spillHi）
document.getElementById（“widthBL”）.setAttribute（“width”，spillWi）
document.getElementById（“heightBL”）.setAttribute（“height”，spillHi）
document.getElementById（“widthTL”）.setAttribute（“width”，spillWi）
document.getElementById（“heightTL”）.setAttribute（“height”，spillHi）

因此，这里有一个更正的代码：

WI=149；
spillHi=58；
document.getElementById（“eltTR”）.setAttribute（“宽度”，spillWi）；
document.getElementById（“eltTR”）.setAttribute（“高度”，spillHi）；
document.getElementById（“eltBR”）.setAttribute（“高度”，spillHi）；
document.getElementById（“eltBR”）.setAttribute（“宽度”，spillWi）；
document.getElementById（“eltBL”）.setAttribute（“宽度”，spillWi）；
document.getElementById（“eltBL”）.setAttribute（“高度”，spillHi）；
document.getElementById（“eltTL”）.setAttribute（“宽度”，spillWi）；
document.getElementById（“eltTL”）.setAttribute（“高度”，spillHi）；

WI=100
spillHi=25
document.getElementById（“widthTR”）.setAttribute（“width”，spillWi）
document.getElementById（“widthTR”）.setAttribute（“高度”，spillHi）
document.getElementById（“widthBR”）.setAttribute（“width”，spillWi）
document.getElementById（“widthBR”）.setAttribute（“高度”，spillHi）
document.getElementById（“widthBL”）.setAttribute（“width”，spillWi）
document.getElementById（“widthBL”）.setAttribute（“高度”，spillHi）
document.getElementById（“widthTL”）.setAttribute（“width”，spillWi）
document.getElementById（“widthTL”）.setAttribute（“高度”，spillHi）

---

这能解决你的问题吗？您需要删除第二个id并使用一个id设置属性

前面的答案都不能解释出哪里出了问题。您正在构建页面之前设置元素的属性。如果将代码插入到

$（准备就绪时调用函数（）{//（生成DOM）…}）

---

宽度会如您所期望的那样更改。

您使用图像和javascript这样做有什么好的原因吗？不仅仅CSS是更好的选择吗？即使是图像和CSS，如果你不喜欢边界半径…顺便说一下，你已经为每个元素设置了两个ID，你只能设置一个。。。这可能是你错误的根源。

 <img src="https://dl.dropboxusercontent.com/u/34546427/BBBS-edc/PuddleTR.png"
id="widthTR" style="position: absolute; bottom: 58px; left: 149px"/>

<img src="https://dl.dropboxusercontent.com/u/34546427/BBBS-edc/PuddleBR.png"
id="widthBR" style="position: absolute; top: 58px; left: 149px"/>

 <img src="https://dl.dropboxusercontent.com/u/34546427/BBBS-edc/PuddleBL.png"
 id="widthBL" style="position: absolute; top: 58px; right: 149px"/>

 <img src="https://dl.dropboxusercontent.com/u/34546427/BBBS-edc/PuddleTL.png"
 id="widthTL" style="position: absolute; bottom: 58px; right: 149px"/>


<script>

 spillWi = 100
 spillHi = 25

 document.getElementById("widthTR").setAttribute("width", spillWi)
 document.getElementById("widthTR").setAttribute("height", spillHi)

 document.getElementById("widthBR").setAttribute("width", spillWi)
 document.getElementById("widthBR").setAttribute("height", spillHi)

 document.getElementById("widthBL").setAttribute("width", spillWi)
 document.getElementById("widthBL").setAttribute("height", spillHi)

 document.getElementById("widthTL").setAttribute("width", spillWi)
 document.getElementById("widthTL").setAttribute("height", spillHi)

 </script>