সরল জাভাস্ক্রিপ্টের সাথে দ্বি উচ্চতা পান

Question

JQuery ব্যবহার না করে ডিভের উচ্চতা কীভাবে পাবেন সে সম্পর্কে কোনও ধারণা?

আমি এই প্রশ্নের জন্য স্ট্যাক ওভারফ্লো অনুসন্ধান করছিলাম এবং মনে হচ্ছে প্রতিটি উত্তর jQuery এর দিকে নির্দেশ করছে .height()।

আমি এর মতো কিছু চেষ্টা করেছি myDiv.style.height, তবে এটি আমার ডিভটি সিএসএসে সেট widthএবং heightসেট করার পরেও কিছুই ফিরিয়েছিল না ।

Comments

stackoverflow.com/a/10118190/1172872

— sk8terboi87ツ

সম্ভাব্য সদৃশ আপনি কীভাবে কোনও উপাদানের রেন্ডার উচ্চতা পাবেন?

— পেনি লিউ

Answer 1

var clientHeight = document.getElementById('myDiv').clientHeight;

অথবা

var offsetHeight = document.getElementById('myDiv').offsetHeight;

clientHeight প্যাডিং অন্তর্ভুক্ত।

offsetHeight প্যাডিং, স্ক্রোলবার এবং সীমানা অন্তর্ভুক্ত।

Comments

অফসাইটহাইট quirksmode.org/mobile/tableViewport_desktop.html এর নীচে ie10 এ wokr না

— ভয়ঙ্কর

আপনি ব্যবহার করতে পারেন scrollHeightযার মধ্যে থাকা দস্তাবেজের উচ্চতা, উল্লম্ব প্যাডিং এবং উল্লম্ব সীমানা অন্তর্ভুক্ত রয়েছে।

— সাeদ জেবার্ডাস্ট

clientHeightপ্যাডিংও অন্তর্ভুক্ত রয়েছে, সুতরাং এটি সমান নয়$.height()

— ভি

সীমানা এবং মার্জিন এছাড়াও জায়গা গ্রহণ আছে। :) এবং আপনার উত্তরটি বোঝায় clientHeightযে প্যাডিং অন্তর্ভুক্ত নয়। এবং প্রশ্ন উভয়ই উল্লেখ করে $.height()এবং এর .style.heightমধ্যে কোনটি প্যাডিং অন্তর্ভুক্ত করে, এটি জিজ্ঞাসা করে যে এটি চাওয়া হয় না।

— veভী

দ্রষ্টব্য: ওপি প্যাডিং বাদ দিয়ে এমন উত্তর চেয়েছিল না । যার বিষয়ে আমি অবগত সেগুলির জন্য কোনও নেটিভ ক্রস প্ল্যাটফর্ম সমাধান নেই।

— ড্যান

Answer 2

jsFiddle

var element = document.getElementById('element');
alert(element.offsetHeight);

Answer 3

আর একটি বিকল্প হ'ল getBoundingClientRect ফাংশনটি ব্যবহার করা। অনুগ্রহ করে নোট করুন যে উপাদানটির প্রদর্শন 'কিছুই না' হলে getBoundingClientRect একটি খালি রেকট ফিরে আসবে।

উদাহরণ:

var elem = document.getElementById("myDiv");
if(elem) {
   var rect = elem.getBoundingClientRect();
   console.log(rect.height);  
}

Comments

আমি মনে করি এটি আরও ভাল সমাধান

— ইন্টারভালিয়া

Answer 4

var myDiv = document.getElementById('myDiv'); //get #myDiv
alert(myDiv.clientHeight);

ক্লায়েন্টহাইট এবং ক্লায়েন্টউইথ আপনি যা সন্ধান করছেন তা।

অফসেটহাইট এবং অফসেটউইথ এছাড়াও উচ্চতা এবং প্রস্থ ফিরে আসে কিন্তু এটি সীমানা এবং স্ক্রোলবার অন্তর্ভুক্ত। পরিস্থিতির উপর নির্ভর করে আপনি একটি বা অন্যটি ব্যবহার করতে পারেন।

আশাকরি এটা সাহায্য করবে.

Answer 5

অন্য উত্তরগুলি আমার পক্ষে কাজ করছে না। আমি ডাব্লু 3 স্কুলগুলিতে যা পেয়েছি তা এখানে , ধরে নিলাম divএকটি heightএবং / অথবা widthসেট রয়েছে।

আপনার যা দরকার তা হ'ল heightএবং widthপ্যাডিং বাদ দিন।

    var height = document.getElementById('myDiv').style.height;
    var width = document.getElementById('myDiv').style.width;

আপনারা অবনতিশীলরা: এই উত্তরটি কমপক্ষে ৫ জনকে সহায়তা করেছে, আমি যে সমীক্ষা পেয়েছি তা বিচার করে। আপনি যদি এটি পছন্দ না করেন তবে আমাকে কেন এটি ঠিক করতে পারি তা বলুন। এটি ডাউনভোটগুলির সাথে আমার সবচেয়ে বড় পোষা প্রাণী; আপনি খুব কমই আমাকে বলবেন যে আপনি এটিকে কেন নিম্নচোট করেছেন।

Comments

ডিভের একটি সেট heightএবং / বাwidth

— হপকিনস-ম্যাট

আমি ভেবেছিলাম যে অনুমিত এবং নিহিত ছিল। আপনি কি আমার উত্তরে উল্লিখিত ক্যাভাতটি পছন্দ করবেন?

— 16:41

এটা বেশি ভাল. আমি ব্যক্তিগতভাবে অন্যান্য পদ্ধতিগুলি সঠিক হিসাবে বিবেচনা করব না। আমি একটি ব্যবহার করতে বলতে venture হবে offsetHeightএবং clientHeightপ্রায়ই আরো বেশী style.height।

— হপকিন্স-ম্যাট

তারা আমার পক্ষে কাজ করছিল না। এই কারণেই আমি এই উত্তরটি পোস্ট করেছি।

— 17:14

আমি দেখতে পাচ্ছি না যে ডাব্লু 3 স্কুলগুলি কীভাবে বলে যে অন্যান্য পদ্ধতি সঠিক নয়।

— aknuds1

Answer 6

<div id="item">show taille height</div>
<script>
    alert(document.getElementById('item').offsetHeight);
</script>

Jsfiddle

Answer 7

ছাড়াও el.clientHeightএবং el.offsetHeight, যখন আপনি প্রয়োজন উপাদান ভিতরে বিষয়বস্তুর উচ্চতা আপনি ব্যবহার করতে পারেন (উপাদান নিজেই উচ্চতাকে এতে সেট নির্বিশেষে) el.scrollHeight। অধিক তথ্য

আপনি যদি উপাদানটির উচ্চতা বা সর্বোচ্চ-উচ্চতাটির অভ্যন্তরীণ গতিশীল সামগ্রীর সঠিক উচ্চতায় সেট করতে চান তবে এটি কার্যকর হতে পারে। উদাহরণ স্বরূপ:

var el = document.getElementById('myDiv')

el.style.maxHeight = el.scrollHeight+'px'

Comments

যে কারও জন্যই ভাবছেন, ড্রপডাউনগুলির জন্য গতিশীল-উচ্চতার সামগ্রী রয়েছে

— ক্রোনোকলি

Answer 8

চেষ্টা

myDiv.offsetHeight 

console.log("Height:", myDiv.offsetHeight );

#myDiv { width: 100px; height: 666px; background: red}

<div id="myDiv"></div>

Answer 9

এখানে আরও একটি বিকল্প রয়েছে:

var classElements = document.getElementsByClassName("className");

function setClassHeight (classElements, desiredHeightValue) 
    {
        var arrayElements = Object.entries(classElements);
        for(var i = 0; i< arrayElements.length; i++) {
            arrayElements[i][1].style.height = desiredHeightValue;
        }

    }

Answer 10

একটি বিকল্প হবে

const styleElement = getComputedStyle(document.getElementById("myDiv"));
console.log(styleElement.height);