HTML DOM Element clientWidth ਪ੍ਰਤੀਯੋਗ

ਪਰਿਭਾਸ਼ਾ ਅਤੇ ਵਰਤੋਂ

clientWidth ਪ੍ਰਤੀਯੋਗ ਇਲੈਕਟ੍ਰੌਨਿਊਮ ਦੀ ਦਿਸ਼ਾ ਪਹੁੰਚ ਵਿਸ਼ਾਲਤਾ ਵਾਪਸ ਦਿੰਦੇ ਹਨ, ਸਮੇਤ ਅੰਦਰੂਨੀ ਪੈਡਿੰਗ, ਬੰਦ ਬੋਰਡਰ, ਸਰਕਲ ਬਾਰਡਰ ਜਾਂ ਬਾਹਰੀ ਮਾਰਜਿਨ ਨਹੀਂ ਸਮੇਤ ਹੁੰਦੇ ਹਨ, ਪਿਕਸਲ ਦੇ ਰੂਪ ਵਿੱਚ

clientWidth ਇਹ ਪ੍ਰਤੀਯੋਗ ਸਿਰਫ ਲੜੀਬੱਧ ਹਨ

ਦੇਖੋ:CSS ਫਰੇਮਵਰਕ ਟੂਰ

ਦੇਖੋ:

clientHeight ਪ੍ਰਤੀਯੋਗ

clientTop ਪ੍ਰਤੀਯੋਗ

clientLeft ਪ੍ਰਤੀਯੋਗ

offsetHeight ਪ੍ਰਤੀਯੋਗ

offsetWidth ਪ੍ਰਤੀਯੋਗ

ਜੇਕਰ ਤੁਸੀਂ ਸਰਕਲ ਬਾਰਡਰ ਜੋੜਨਾ ਚਾਹੁੰਦੇ ਹੋ ਤਾਂ ਇਸ ਤੋਂ ਵਰਤੋਂ ਕਰੋ: CSS overflow ਵਿਸ਼ੇਸ਼ਤਾ。

ਇੰਸਟੈਂਸ

ਉਦਾਹਰਣ 1

"myDIV" ਦੀ ਉਚਾਈ ਅਤੇ ਚੌਡਾਈ ਪ੍ਰਾਪਤ ਕਰੋ, ਸਮੇਤ ਅੰਦਰੂਨੀ ਪੈਡਿੰਗ:

const element = document.getElementById("myDIV");
let text = "clientHeight: " + element.clientHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px";

ਆਪਣੇ ਆਪ ਨਾਲ ਪ੍ਰਯੋਗ ਕਰੋ

ਉਦਾਹਰਣ 2

ਉਦਾਹਰਣ 2: clientHeight/clientWidth ਅਤੇ offsetHeight/offsetWidth ਦਾ ਅੰਤਰ

ਸਰਕਲ ਬਾਰਡਰ ਨਹੀਂ ਹੈ:

const element = document.getElementById("myDIV");
let text = "";
text += "clientHeight: " + element.clientHeight + "px<br>";
text += "offsetHeight: " + element.offsetHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px<br>";
text += "offsetWidth: " + element.offsetWidth + "px";

ਆਪਣੇ ਆਪ ਨਾਲ ਪ੍ਰਯੋਗ ਕਰੋ

ਸਰਕਲ ਬਾਰਡਰ ਹੈ:

const element = document.getElementById("myDIV");
let text = "";
text += "clientHeight: " + element.clientHeight + "px<br>";
text += "offsetHeight: " + element.offsetHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px<br>";
text += "offsetWidth: " + element.offsetWidth + "px";

ਆਪਣੇ ਆਪ ਨਾਲ ਪ੍ਰਯੋਗ ਕਰੋ

ਸਫਟਿਕਰਨ

element.clientWidth

ਵਾਪਸ ਪ੍ਰਾਪਤ ਕੀਤਾ ਗਿਆ ਮੁੱਲ

ਪ੍ਰਕਾਰ ਵਰਣਨ
ਅੰਕ ਇਲੈਕਟ੍ਰੌਨਿਊਮ ਦੀ ਦਿਸ਼ਾ ਪਹੁੰਚ ਵਿਸ਼ਾਲਤਾ (ਪਿਕਸਲ ਦੇ ਰੂਪ ਵਿੱਚ), ਸਮੇਤ ਅੰਦਰੂਨੀ ਪੈਡਿੰਗ

ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ

ਸਾਰੇ ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ ਕਰਦੇ ਹਨ element.clientWidth：

ਚਰਮੋਨੇ ਆਈਈ ਐਜ਼ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪਰਾ
ਚਰਮੋਨੇ ਆਈਈ ਐਜ਼ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪਰਾ
ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ