Screen Object for HTMLDOM series tutorials

Sometimes we want to use Javascript in front-end development to obtain the relevant parameters of the client screen, so as to improve the user experience and improve the program based on the screen size or other information, so what should we do? Actually, this is

Sometimes we want to use Javascript in front-end development to obtain the relevant parameters of the client screen, so as to improve the user experience and improve the program based on the screen size or other information, so what should we do? In fact, this is related to Js Screen objects. What is Screen objects? How does it work? Next let's take a closer look at the Screen object.

The Screen Object is actually an object that contains the Screen information displayed on the client. Although it is not applied to the public standards of the Screen Object, all browsers support it.

Properties of the Screen Object

Width property: returns the width of the display screen.

Height property: returns the height of the display screen.

AvailWidth property: returns the width of the display screen (excluding the taskbar)

AvailHeight property: returns the height of the display screen (excluding the taskbar)

UpdateInterval attribute: set or return the update rate of the display screen

PixelDepth property: returns the color resolution of the display screen (bit per pixel)

BufferDepth attribute: sets or returns the bit depth of the palette.

ColorDepth attribute: returns the color depth of the palette on the target device or buffer.

DeviceXDPI attribute: returns the number of horizontal points per inch on the display screen.

DeviceYDPI property: returns the number of vertical points per inch on the display screen

FontSmoothingEnabled attribute: returns whether the font smoothing is enabled in the display control panel.

LogicalXDPI attribute: returns the regular number of points in the horizontal direction of the screen per inch.

LogicalYDPI attribute: returns the regular verticals of the display screen per inch.

Support for various browsers

Attribute	IE	F	O
AvailHeight	4	1	9
AvailWidth	4	1	9
BufferDepth	4	No	No
ColorDepth	4	1	9
DeviceXDPI	6	No	No
DeviceYDPI	6	No	No
FontSmoothingEnabled	4	No	No
Height	4	1	9
LogicalXDPI	6	No	No
LogicalYDPI	6	No	No
PixelDepth	No	1	9
UpdateInterval	4	No	No
Width	4	1	9

Let's test it with code:

1234567891011