如何使用jQuery将字符串的第一个字母转换为大写

如何使用jQuery将字符串的第一个字母转换为大写

我们的任务是在jQuery的帮助下,在不使用toUpperCase()方法的情况下,将字符串的第一个字母大写。有两种方法,下面讨论。

方法1:在这个例子中,css()方法被用来设置文本转换属性值为大写。

示例:

<!DOCTYPE HTML> 
<html> 
  
<head> 
    <title> 
        How to convert first letter of a
        string to upper case using jQuery?
    </title>
      
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">
    </script>
</head> 
  
<body style = "text-align:center;"> 
      
    <h1 style = "color:green;" > 
        GeeksForGeeks 
    </h1>
      
    <p>
        Click on the button to
        perform the operation.
    </p>
      
    Type Here: <input id = "input"/>
    <br><br>
      
    <button onclick = "GFG_Fun()">
        Click Here
    </button>
      
    <p id = "GFG"></p>
      
    <script>
        var geeks = document.getElementById('GFG');
          
        function GFG_Fun() {
            $('#input').css('textTransform', 'capitalize');
            geeks.innerHTML = "Text is capitalized";
        }
    </script> 
</body> 
  
</html>

输出:
如何使用jQuery将字符串的第一个字母转换为大写?

方法2:在这个例子中,我们使用CSS属性来执行操作。一个新的ID已经被添加到该元素中,它将属性text-transform设置为capitalize

示例:

<!DOCTYPE HTML> 
<html> 
  
<head> 
    <title> 
        How to convert first letter of a
        string to upper case using jQuery?
    </title>
      
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">
    </script>
      
    <style>
        #capital {
            text-transform: capitalize;
        }
    </style>
</head> 
  
<body style = "text-align:center;"> 
      
    <h1 style = "color:green;" > 
        GeeksForGeeks 
    </h1>
      
    <p>
        Click on the button to
        perform the operation.
    </p>
      
    Type Here: <input id = "input"/>
    <br><br>
      
    <button onclick = "GFG_Fun()">
        Click Here
    </button>
      
    <p id = "GFG"></p>
      
    <script>
        var geeks = document.getElementById('GFG');
          
        function GFG_Fun() {
            $('#input').attr('id', 'capital');
            geeks.innerHTML = "Text is capitalized";
        }
    </script> 
</body> 
  
</html>

输出:
如何使用jQuery将字符串的第一个字母转换为大写?

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程