X
Nhấn vào đây để đến phiên bản di động của trang web.

Diễn đàn trợ giúp

How to get the rectangle of the text in an element (not the rectangle of element itself)?

Được đăng

Sometimes the rectangle of the text in an element is different from the rectangle of the element itself. I know there are tow functions: Element.getBoundingClientRect() and Element.getClientRects(). but they can not find the rectangle of the text in an element.

For example, there is following element button: <button style="position:absolute; left:58px; top:324px; width:100px; height:40px;"> Both the span and the paragraph have a border set. </button> The text of the above button has gone out of the button. How can I get the rectangle of the text in this button?

Sometimes the rectangle of the text in an element is different from the rectangle of the element itself. I know there are tow functions: Element.getBoundingClientRect() and Element.getClientRects(). but they can not find the rectangle of the text in an element. For example, there is following element button: <button style="position:absolute; left:58px; top:324px; width:100px; height:40px;"> Both the span and the paragraph have a border set. </button> The text of the above button has gone out of the button. How can I get the rectangle of the text in this button?
Đính kèm ảnh chụp màn hình
Trích dẫn
cor-el
  • Top 10 Contributor
  • Moderator
17468 giải pháp 157871 câu trả lời
Được đăng

Looks that that height property isn't large enough. Best is to set the height to auto to let the browser make all text fit.


<button style="position:absolute; left:58px; top:324px; width:100px; height:auto;"> Both the span and the paragraph have a border set. </button>
Looks that that height property isn't large enough. Best is to set the height to auto to let the browser make all text fit. ---- <pre><nowiki><button style="position:absolute; left:58px; top:324px; width:100px; height:auto;"> Both the span and the paragraph have a border set. </button></nowiki></pre>
Bài viết này có hữu ích với bạn không?
Trích dẫn
jscher2000
  • Top 10 Contributor
8689 giải pháp 71030 câu trả lời
Được đăng

dai_juntang said

I know there are tow functions: Element.getBoundingClientRect() and Element.getClientRects(). but they can not find the rectangle of the text in an element.

A text node is not an element, so a text node doesn't have those two methods. Why do you need a rectangle instead of the textContent?

''dai_juntang [[#question-1269126|said]]'' <blockquote> I know there are tow functions: Element.getBoundingClientRect() and Element.getClientRects(). but they can not find the rectangle of the text in an element. </blockquote> A text node is not an element, so a text node doesn't have those two methods. Why do you need a rectangle instead of the textContent?
Bài viết này có hữu ích với bạn không?
Trích dẫn

Người tạo câu hỏi

Thanks for your replies. I have got the answer of my question in: https://stackoverflow.com/questions/58005936/how-to-get-the-rectangle-of-the-text-in-an-element-of-the-web-page-not-the-rect/58006078#58006078
Bài viết này có hữu ích với bạn không?
Trích dẫn
Đặt một câu hỏi

Bạn phải đăng nhập vào tài khoản của bạn để trả lời bài viết. Vui lòng bắt đầu một câu hỏi mới, nếu bạn chưa có tài khoản.