Аналог `element.style.left = variable + 'px'`, только без 'px'

236
28 сентября 2017, 14:07

Имеется элемент:

let element = document.getElementById('id')

Я могу изменить его css-свойство left вот так:

let left = ...
highlight.style.left = left + 'px';

Есть ли аналог этого, только без необходимости писать 'px'?

Например, с помощью jquery можно так:

$(element).css('left', left);

А можно без jquery (и без 'px')?

Answer 1

Да. Нет. Нет.

Хотя ну ладно, на последний вопрос - да:

var $ = (function () { 
  var allowNumber = ['lineHeight']; 
 
  function $(el) { 
    if (this instanceof $) { 
      this.el = el; 
    } else { 
      return new $(el); 
    } 
  } 
 
  $.prototype.css = function (key, value) { 
    key = key.replace(/-(\w)/g, function (m, ch) { return ch.toUpperCase() }); 
   
    if (+value == value && allowNumber.indexOf(key) === -1) { 
      value += 'px'; 
    } 
     
    this.el.style[key] = value; 
     
    return this; 
  } 
   
  return $; 
})(); 
 
$(document.querySelector("div")).css('left', 100).css('line-height', 3);
div { 
  position: absolute; 
  left: 0; 
  top: 0; 
  background: silver; 
}
<div>123</div>

PS: Пиксели - зло.

READ ALSO
увеличение ширины при прокрутке вниз

увеличение ширины при прокрутке вниз

состряпал из примеров вот такой кодпо идеи он должен увеличивать ширину при прокрутке вниз и уменьшать при прокрутке вверх

228
Верстка адаптивных блоков

Верстка адаптивных блоков

Необходимо разместить три блока таким образом как на картинке с помощью flexbox

286
Рамки между элементами меню (списка)

Рамки между элементами меню (списка)

Ребят нужна помощь, как сделать так что бы рамки шли по центру между слов как показано на скриншоте:

315