如何在 JavaScript 中设置文本中单词之间的间距?
javascriptobject oriented programmingfront end technology
在本文中，我们将学习如何在 JavaScript 中设置文本中单词之间的间距。
单词间距在网站上至关重要，因为它可以提高页面上显示的文本的可读性和可读性。您可以使用适当的单词间距生成美观且易于阅读的字体。
在JavaScript中，我们使用wordSpacing属性来设置网站上显示的文本中单词之间的间距。
使用样式wordSpacing属性
此JavaScript DOM属性用于获取和设置文本中单词之间的间距
根据您的需要，您可以将wordSpacing属性的值设置为正值或负值。例如，根据您的需要，您可以将单词间距的值设置为 50 px 或 -50px
与 Web 浏览器的兼容性
此 JavaScript 属性与浏览器兼容，包括 Google Chrome、Safari、Internet Explorer、Opera、Chromium 和 Mozilla Firefox。
语法
要在文本中实现此 JavaScript 属性，您应该遵循以下语法 -
object.style.wordSpacing = "normal | length | initial | inherit"
参数
- normal - 这是单词间距的默认值。使用时，它返回正常间距的单词。
- length - 指定单词之间的间距。 length 的值可以是正数也可以是负数。
- initial − 此值将属性设置为其默认值
- inherit − 此值用于从其父元素继承属性。
示例
在此示例中，我们将使用 wordSpacing 属性来设置单词之间的间距。我们将单词间距设置为 50px。
<html> <head> <style> #myText { font-family: sans-serif; font-weight: normal; font-size: 18px; } </style> </head> <body> <h3> Setting the Spacing between words in a text in JavaScript using <i> wordSpacing </i> Property </h3> <p id="myText"> Some placeholder material for this multi-collapse example's initial collapse component. </p> <script> var output = document.getElementById("myText").style.wordSpacing="50px"; </script> </body> </html>
示例 2
在此示例中，我们将单词间距的长度设置为负值。我们将该值设置为 -30 像素。
<html> <head> <style> #myText { font-family: sans-serif; font-weight: normal; font-size: 18px; } </style> </head> <body> <h3> Setting the Spacing between words in a text in JavaScript using <i> wordSpacing </i> Property </h3> <p id="myText"> Some placeholder material for this multi-collapse example's initial collapse component. </p> <script> var output=document.getElementById("myText").style.wordSpacing="-30px"; </script> </body> </html>
示例 3
在此示例中，我们将单词间距值设置为正常。
<html> <head> <style> #myText { font-family: sans-serif; font-weight: normal; font-size: 18px; } </style> </head> <body> <h3> Setting the Spacing between words in a text in JavaScript using <i> wordSpacing </i> Property </h3> <p id="myText"> Some placeholder material for this multi-collapse example's initial collapse component. </p> <script> var output=document.getElementById("myText").style.wordSpacing=normal; </script> </body> </html>
本文教我们如何使用 JavaScript 的 wordSpacing 属性设置文本中单词之间的间距。使用此属性，您可以为单词间距的长度指定负值、正值或正常值。
