Хатоҳо бо воҳидҳои ченак дар JavaScript

Аксар вақт осон аст, ки хато кунед ва дар бораи воҳидҳои ченак фаромӯш кунед. Масалан, ин тавр:

javascriptlet width = 100;
elem.style.width = width; // уфс...

Дуруст ин аст, ки қиматро дар пикселҳо муайян кунед:

javascriptlet width = 100;
elem.style.width = width + 'px';

Фарз кунем, ки мо мехоҳем паҳнӣро ба чанд қимат зиёд кунем. Барои ин аввал мо бояд паҳниро хонем, пас рақамро берун кашем, ба он илова кунем қимати зарурӣ, илова кунед 'px' ва фақат баъд ба қайд баргардонем:

javascriptlet widthPx = elem.style.width;
let widthNm = parseInt(widthPx);
elem.style.width = (widthNm + 30) + 'px';

Задание 1

Шарҳ диҳед, ки хато дар рамзи зерин дар чист:

html<div style="font-size: 16px;">
  матн
</div>

javascriptlet elem = document.querySelector('div');
elem.style.fontSize = elem.style.fontSize + 2;

Задание 2

Шарҳ диҳед, ки хато дар рамзи зерин дар чист:

html<div style="font-size: 16px;">
  матн
</div>

javascriptlet elem = document.querySelector('div');
elem.style.fontSize = parseInt(elem.style.fontSize + 2) + 'px';

Задание 3

Шарҳ диҳед, ки хато дар рамзи зерин дар чист:

html<div style="font-size: 2.5em;">
  матн
</div>

javascriptlet elem = document.querySelector('div');
elem.style.fontSize = parseInt(elem.style.fontSize) + 2 + 'em';

Задание 4

Div дода шудааст:

html<div id="elem" style="width: 300px; height: 200px; border: 1px solid red;">
  матн
</div>

Тугма низ дода шудааст. Бо клик кардан ба тугма паҳнӣ ва баландии div-ро зиёд кунед ба 50px.

Задание 5

Div дода шудааст:

html<div id="elem" style="width: 300px; height: 200px; border: 1px solid red;">
  матн
</div>

Тугма низ дода шудааст. Бо клик кардан ба тугма паҳнӣ ва баландии div-ро зиёд кунед ба 10%.