Mavi metin seçiminin boyutu nasıl alınır?

Question

Metni seçtiğinizde görüntülenen mavi kutunun boyutunu (genişliğini ve yüksekliğini) almanın mümkün olup olmadığını bilmek istedim.

Answer 1

document.getElementById("area").addEventListener("mouseup", function() { 
 
    var bcr = getSelection().getRangeAt(0).getBoundingClientRect(); 
 
    document.getElementById("info").innerHTML = "W: "+ bcr.width +' H:'+ bcr.height; 
 
}, false);

<div id="area"> 
 
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quaerat consectetur incidunt vel praesentium cum blanditiis tempora doloribus culpa odit! Labore at cum ad, voluptas nobis nam iste non omnis vitae? 
 
</div> 
 
<b id="info"></b>

Yani bu yöntem,

olarak genişliğini sağlayan herhangi bir değere şimdi alabileceğiniz bcr değişkene seçimin aralığını .getBoundingClientRect() aldıktan sonra, boy, üst, sol, sağ, alt

https://developer.mozilla.org/en/docs/Web/API/Element/getBoundingClientRect