Экран объект
Получите высоту и ширину экрана (разрешение)
Screen.width // Wide Screen.Height // High Screen.AvailWidth // Экран может использоваться для вычитания значения после высоты системы системы.
Оконная объект
Получите положение и размер окна
window.screentop // расстояние от верхней части окна до верхней части экрана. // Chrome 1366 FF 1366 IE 1366 window.innerheight // Высота точки зрения в окне это значение связано с такими факторами, как, отображает ли браузер строку меню и т. Д. Оповещение (window.innerheight); // Chrome 643 FF 657 IE 673Window.outerWidth // Ширина самого окна браузера (видимая ширина площади + ширина границы браузера) (Window.outerWidth); // Chrome 1366 FF 1382 IE 1382 // Укажите, что при максимизированном хром у окна браузера нет ширины границы, и когда он не максимизирован, ширина границы 8px // FF и IE вверх, вниз, влево и правое окно. // Chrome 728 FF 744 IE 744
элемент объект
Прежде чем представить различные высоты и ширину объектов элемента, необходимо объяснить модель коробки.
По умолчанию ящик для модели: Content-box;
Boxwidth = 2*Margin + 2*Border + 2*Padding + WidthboxHeight = 2*Margin + 2*Border + 2*Padding + Высота
Когда не появляется прокрутка
Body {margin: 0;}#demo {width: 100px; высота: 100px; Заполнение: 10px; Граница: 20px; Полевая: 30px; Фоно-цвета: красный;} <div id = "demo"> 123456789 123456789 </div>Клиентская Whidth: возвращает видимую ширину контента на странице (за исключением границ, краев или полос прокрутки)
ClientHeight: возвращает видимую высоту контента на странице (за исключением границ, краев или полос прокрутки)
ClientWidth = 2*Padding + ширина - ScrollbarWidth Console.log (document.getElementById ('demo'). ClientWidth); // 120 В это время scrollbarwidth = 0clientHeight = 2*Padding + Height - Scrollbarheight Console.log (document.getElementById ('demo'). ClientHeight); // 120 В это время scrollbarwidth = 0OffsetWidth: возвращает ширину элемента, включая границу и заполнение, но не включает маржу
Offsetheight: возвращает высоту элемента, включая границы и заполнения, но не включает маржу
OffsetWidth = 2*граница + 2*Padding + Width Console.log (document.getElementbyId ('demo'). OffsetWidth) // 160OffsetHeight = 2*Border + 2*Padding + Height Console.log (Document.GetElementByID ('demo'). OffsetheElt) // 160Offsetleft: Получает рассчитанное левое положение объекта относительно макета или родительской координаты, указанной в свойстве OffSetleft
OffSetTotop: Получает рассчитанную верхнюю позицию объекта относительно макета или родительской координаты, указанной в свойстве OffSetTop
console.log (document.getElementById ('demo'). offsetleft) //30console.log(document.getElementByid('demo').offsettop) // 30Когда появляется прокрутка
Тело {маржа: 0; Заполнение: 20px; Ширина: 1000px; Высота: 500px;} <div id = "demo"> 123456789123456789 </div>Прокрутка: возвращает всю ширину элемента (включая скрытые места с полосами прокрутки)
Scrollheight: возвращает высоту всего элемента (включая скрытые места с полосами прокрутки)
ScrollWidth = 2*Padding + Width Console.log (document.body.scrollwidth) // 1040scrollheight = 2*padding + width console.log (document.scrollheight) // 540
Scrolltop: высота скрытого контента элемента при скольжении вниз по блоку прокрутки. Когда не установлено, по умолчанию равна 0, а его значение изменяется по мере прокрутки блоков прокрутки
Прокрутка: ширина скрытого контента элемента при скольжении блока прокрутки вправо. Когда не установлено, по умолчанию равна 0, а его значение изменяется по мере прокрутки блоков прокрутки
Объект события
Объект события представляет состояние события, такое как элемент, в котором происходит событие, состояние клавиши клавиатуры, положение мыши и статус кнопки мыши.
Event.pagex: относительно координат всей страницы, верхний левый угол страницы - горизонтальное расстояние от начала координаты до точки, где находится мышь (IE8 не поддерживает его)
Event.pagey: относительно координат всей страницы, верхний левый угол страницы является вертикальным расстоянием от происхождения координаты до точки, где расположена мышь (не поддерживается IE8)
Event.Clientx: координаты относительной визуальной области, используя верхний левый угол визуальной области браузера в качестве горизонтального расстояния от происхождения координат до точки, где расположена мышь, используя верхний левый угол визуальной области браузера в качестве горизонтального расстояния от координат до точки, где находится мышь
Event.clienty: координаты относительной визуальной области, используя верхний левый угол визуальной области браузера в качестве вертикального расстояния от координатного происхождения до точки, где расположена мышь, используя верхний левый угол визуальной области браузера в качестве вертикального расстояния от точки происхождения координат до точки, где находится мышь
Event.screenx: относительно координат экрана компьютера, горизонтальное расстояние от координат -происхождения до точки, где расположена мышь, используя верхний левый угол экрана в качестве горизонтального расстояния от точки происхождения координат до точки, где находится мышь
Event.screeny: относительно координат экрана компьютера, вертикальное расстояние от происхождения координат до точки, где расположена мышь, используя верхний левый угол экрана в качестве вертикального расстояния от точки происхождения координат до точки, где находится мышь
Event.OffSetX: относительно его собственных координат, горизонтальное расстояние от координатного происхождения верхнего левого угла собственного заполнения до точки, где расположена мышь, основано на ее горизонтальном расстоянии от координат происхождения координат до точки, где находится мышь
Event.offsety: относительно своих собственных координат, горизонтальное расстояние от координатного происхождения верхнего левого угла его собственной прокладки до точки, где расположена мышь, основано на его горизонтальном расстоянии от координатного происхождения.
Приведенная выше резюме методов получения различных высот и ширины и позиций веб -страниц в JavaScript - это весь контент, разделенный редактором. Я надеюсь, что это может дать вам ссылку, и я надеюсь, что вы будете поддерживать Wulin.com больше.