在 JavaScript 中将字符串转换为标题大小写

在 JavaScript 中，我们可以使用两种方法将字符串转换为标题大小写。标题大小写即每个单词的首字母大写，其余字母小写。

使用 toLocaleUpperCase() 和 toLocaleLowerCase() 方法

我们可以使用 toLocaleUpperCase() 和 toLocaleLowerCase() 方法来将字符串转换为标题大小写。这些方法会将字符串中的每个单词的首字母大写，其余字母小写。

const str = 'hello world';
const titleCaseStr = str.toLocaleUpperCase().replace(/\b\w/g, l => l.toLocaleUpperCase()); // Hello World
const lowerCaseStr = str.toLocaleLowerCase(); // hello world

上述代码中，我们首先定义了一个字符串 str。接着，我们使用 toLocaleUpperCase() 方法将字符串转换为大写，并将其存储在 titleCaseStr 变量中。随后，我们又使用正则表达式和 toLocaleUpperCase() 方法将每个单词的首字母大写，最终得到了一个标题大小写的字符串。

我们还使用 toLocaleLowerCase() 方法将字符串转换为小写，并将其存储在 lowerCaseStr 变量中。

使用 CSS text-transform 属性

我们还可以使用 CSS 的 text-transform 属性来将字符串转换为标题大小写。这种方法需要将字符串放在 HTML 页面中，并使用 CSS 将其转换为标题大小写。

<div class="title-case">hello world</div>
<div class="lower-case">HELLO WORLD</div>

.title-case {
  text-transform: capitalize;
}
.lower-case {
  text-transform: lowercase;
}

上述代码中，我们在 HTML 页面中定义了两个 <div> 元素，分别包含了一个标题大小写和一个小写的字符串。

接着，我们使用 CSS 的 text-transform 属性将第一个字符串转换为标题大小写，将第二个字符串转换为小写。text-transform 属性提供以下几个值：

• none：不转换任何字符的大小写
• capitalize：将每个单词的首字母大写
• uppercase：将每个字母大写
• lowercase：将每个字母小写
• full-width：将每个字符转换为全角字符

总结

以上就是在 JavaScript 中将字符串转换为标题大小写的两种方法。第一种方法使用 toLocaleUpperCase() 和 toLocaleLowerCase() 方法，适用于将字符串用作 JavaScript 变量的情况；第二种方法使用 CSS 的 text-transform 属性，在 HTML 页面中使用时非常方便。