使用 jquery 将 H1 内容更改为小写

Question

我正在寻找一种方法将我的 H1 内容（实际上是大写）转换为小写。理想情况下，如果存在于 jquery.Why in jquery 中，将其更改为 text-tranform 属性的大写 css 设置可能会很棒？因为 css 方式不允许我这样做.. 这是我的起始代码：

$('h1').each(function(){
var h1content = $(this).val().toLowerCase();
$(this).text().toLowerCase();
 });

谢谢

编辑：通过将此提示添加到 JS 方式来修复它，https://css-tricks.com/almanac/selectors/f/first-letter/

Sass代码：

h1.titre-vdl{
    color: $violet;
    &::first-letter{
        text-transform: capitalize;
    }
}

Answer 1

将 text-transform css 属性添加到 h1 标签以将文本转换为小写

$('h1').css('text-transform','lowercase');

Answer 2

h1 没有值，它有 text() 或 html()。

$('h1').each(function(){
    $(this).text( $(this).text().toLowerCase() );
});

Answer 3

您需要在方法中传递值 html() or text()

$('h1').each(function() {
  var h1content = $(this).text().toLowerCase();
  $(this).text(h1content);
});

我建议你使用 css:

h1{
  text-transform: lowercase;
}

Answer 4

您可以使用.text()

$('h1').text(function(_, text){
    return text.toLowerCase();
});

不过我会@JayeshChitroda接近

Answer 5

使用html或文字：

$('h1').each(function(){
    $(this).text( $(this).text().toLowerCase() );
});

或

$('h1').each(function(){
    $(this).html( $(this).html().toLowerCase() );
});

Answer 6

试试这个纯 javascript 代码

var h1Elements = document.querySelectorAll('h1');
for (var ele of h1Elements) {
  ele.innerHTML = ele.innerHTML.toLowerCase();
  console.log(ele.innerHTML)
}

使用 jquery 将 H1 内容更改为小写

Change H1 content to lowercase with jquery

javascript

jquery

html

lowercase