Question

我正在尝试设置显示在页面上的所有图像的位置。我试图通过DOM设置一幅图像的位置，但似乎没有效果。控制台正在打印更新位置消息，但是图像位置没有被更新。我可以通过DOM访问图像，因为可以通过使用'image'元素变量来更新图像宽度。我只是无法更新其位置。

HTML

<div *ngIf='this.imagesPerRow'>
  <div *ngFor="let image of images; let i = index; let last = last">
      {{last ? setPosition() : ''}}
    <img id={{i}} [style.width.%]="width" src={{image.src}} alt="">
  </div>
</div>

CSS

* {
  margin: 0;
  padding: 0;
  border: 0;
}

img {
  display: block;
}

TypeScript

setPosition() {
  const image: HTMLElement = document.getElementById('1');

  if (image) {
    console.log("Updating position");
    image.style.left = "100px";
  }
}

Answer 1

css left属性仅适用于已定位的元素，如here

所述

所以按照以下方式改变您的风格

img {
  display: block;
  position: relative;
}

HTML无法更新元素位置

1 个答案: