判斷一段文字具體長度為多少px
阿新 • • 發佈:2018-12-11
文字中由文字,有英文大小寫,有數字還有各種符號。這時如果要用js判斷它的長度為多少px。
1.獲取字串 str
2.將str拆成陣列arr
3.遍歷arr,分別求出中文個數,大寫英文個數,小寫英文個數.......
4.根據設定的字型大小,求出每種型別字元分別為多少px(直接輸入文字,在網頁裡檢視多大)
5.最後求出文字長度
示例程式碼如下:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script> var str = '江山如此多嬌,引無數英雄競折腰。俱往矣,數風流人物,還看今朝。'; function getTextWidth(str) { var width = 0; var html = document.createElement('span'); html.innerText = str; html.className = 'getTextWidth'; document.querySelector('body').appendChild(html); width = document.querySelector('.getTextWidth').offsetWidth; document.querySelector('.getTextWidth').remove(); return width; } var w = getTextWidth(str); console.log(w); </script> </body> </html>