Отрегулируйте ширину границы изображения с помощью javascript

Question

var images = document.getElementById("facilityThumbNail").getElementsByTagName("img");

for (var i = 0; i < images.length; i++) {
  images[i].onmouseover = function() {
    this.style.cursor = 'hand';
    this.style.borderColor = 'red';
    // this.style.border ? ? ? ? ?
  }
}

<div id="facilityThumbNail">
  <img src="https://unsplash.it/300/300" />
</div>

Просто интересно, может ли кто-нибудь подсказать, как я могу отрегулировать ширину границы для этого изображения, сообщив, что это за атрибут? Это не ширина ...

Answer 1

Укажите borderStyle и borderWidth

var images = document.getElementById("facilityThumbNail").getElementsByTagName("img");

for (var i = 0; i < images.length; i++) {
  images[i].onmouseover = function() {
    this.style.cursor = 'hand';
    this.style.borderWidth = '10px';
    this.style.borderStyle = 'solid';
    this.style.borderColor = 'red';
  }
}

<div id="facilityThumbNail">
  <img src="https://unsplash.it/300/300" />
</div>