document.documentElement.clientWidth - возвращает неправильное значение

Question

Я пытаюсь прочитать текущую ширину окна. В настоящее время для инструментов разработчика chrome установлено значение 768.

Но если я позвоню document.documentElement.clientWidth в консоли, то получу 758.

---

Ответ на предложенный ответ: Нет, jquery также не решает проблему. Если я звоню $(window).width();, тогда я также получаю 758. И если я звоню $(document).width();, я получаю 992

Answer 1

MDN заявляет , что

Свойство Element.clientWidth равно нулю для встроенных элементов и элементов без CSS; в противном случае это внутренняя ширина элемента в пикселях. Он включает отступы, но исключает границы, поля и вертикальные полосы прокрутки (если есть).

, и я вижу полосу прокрутки на вашем скриншоте. Может в этом причина?

Answer 2

Curveball указал мне правильное направление. Я действительно использую пользовательскую полосу прокрутки шириной 10 пикселей, которая вычитается при вызове document.documentElement.clientWidth.

/* Scrollbar */
  ::-webkit-scrollbar {
    width: 10px;
  }

. Я решил это с помощью:

window.innerWidth;    // output: 768