如何以 12 小时 AM/PM 格式显示 JavaScript 日期时间？

JavaScript 使用 24 小时格式作为 DateTime 的默认格式。但是，JavaScript 中的白天可以使用多种方法以 12 小时 AM/PM 格式显示。我们将在本文中研究一对。

方法一：
在这种方法中，我们将仅使用本机方法来更改 DateTime 格式。简单地说，我们将应用模“%”运算符来查找 12 小时格式的小时，并使用条件“?:”运算符来应用“AM”或“PM” 。

程序：

  

    
        
          GeeksforGeeks
      
        
          Click the button to change the 
          format using Native method.
      
        
        
            // JavaScript Program to display
            // current time in 24-hour format
            var date = new Date();
            var hours = (date.getHours() < 10 ? '0' : '') + 
                date.getHours();
            var minutes = (date.getMinutes() < 10 ? '0' : '') + 
                date.getMinutes();
            
            var div = document.getElementById('old_time');
            div.innerHTML = hours + ":" + minutes;
        
  
        
          Change
      
        
        
        
            // JavaScript function to
            // Display 12 hour format
            function myFunction() {
                var date = new Date();
                var hours = date.getHours();
                var minutes = date.getMinutes();
                
                // Check whether AM or PM
                var newformat = hours >= 12 ? 'PM' : 'AM'; 
                
                // Find current hour in AM-PM Format
                hours = hours % 12; 
                
                // To display "0" as "12"
                hours = hours ? hours : 12; 
                minutes = minutes < 10 ? '0' + minutes : minutes;
                
                document.getElementById("change").innerHTML = 
                  hours + ':' + minutes + ' ' + newformat;
            }
        
  

  

前：

后：

方法二：
在这种方法中，我们将利用内置方法toLocaleString()将给定日期的格式更改为 AM-PM 格式。

toLocaleString()：它返回日期对象的字符串表示。 2 个参数Locale和options允许自定义方法的行为。

句法：

dateObject.toLocaleString([locales[, options]])

程序：

  

    
        GeeksforGeeks
        Click the button to change the format.
        
        
            var date = new Date();
            var hours = (date.getHours() < 10 ? '0' : '') +
                date.getHours();
            var minutes = (date.getMinutes() < 10 ? '0' : '') + 
                date.getMinutes();
            var div = document.getElementById('old_time');
            div.innerHTML = hours + ":" + minutes;
        
  
        
          Change
      
        
        
        
            var now = new Date();
            var hours = now.getHours();
  
            function myFunction() {
                var d = new Date();
                var n = d.toLocaleString([], {
                    hour: '2-digit',
                    minute: '2-digit'
                });
                document.getElementById("change").innerHTML = n;
            }
        
  

  

前：

后：