Analyse des problèmes existant dans la méthode toLocaleTimeString()

Au cours des deux derniers jours, j'ai corrigé un bug et découvert un problème : il existe une différence entre la méthode toLocaleTimeString() sur IE et Google Chrome dans la conversion de la partie heure de l'objet Date (hors date) en un " chaîne d'heure" selon le format de l'heure locale. . Il ne devrait y avoir aucune différence dans les méthodes à l'origine, mais la différence n'apparaît qu'une fois que le navigateur l'a traitée !

Voici le code de test :

    /**   验证Date 对象(时间模块) toLocaleTimeString()方法分别在IE和谷歌浏览器上 根据本地时间格式，把 Date 对象的时间部分转换为“时间字符串”存在区别
    *   从而区别substr(index,length)方法为什么在处理同一个时间字符串，在两个浏览器上的到的结果不一样！
    * */function localeTime(){ 　　//toLocaleTimeString() 根据本地时间格式，把 Date 对象的时间部分(不含日期)转换为字符串。var date = new Date();     //toLocaleTimeString()转换的时间，会在时、分、秒不足十的情况下在前面自行加"0"，如"01:02:03"  两个浏览器都会var localeTime = date.toLocaleTimeString();
        console.log(localeTime,localeTime.length);for(var i= 0; i<localeTime.length; i++){
            console.log(localeTime[i]);
        }var substr = localeTime.substr(0,6);
        console.log(substr);
    }function hou_min_sec(){ 　　//getHours(),getMinutes(),getSeconds() 单独获取Date 对象时分秒，然后通过拼接整合成一个时间字符串。var date = new Date();  //getHours(),getMinutes(),getSeconds() 获取的时间，"不会"在时、分、秒不足十的情况下自行加"0"，如"1:2:3",若要格式一样，则需要另行处理 两个浏览器都不会var hou = date.getHours();var min = date.getMinutes();var sec = date.getSeconds();var hou_min_sec = hou +":"+ min +":"+ sec;
        console.log(hou_min_sec,hou_min_sec.length);for(var i= 0; i<hou_min_sec.length; i++){
            console.log(hou_min_sec[i]);
        }var substr = hou_min_sec.substr(0,6);
        console.log(substr);
    }

La capture d'écran est la suivante :

Figure 1 : Cette image montre le deux méthodes sur Google D'après la situation d'exécution, on peut voir que la partie supérieure de est traitée par toLocaleTimeString(), et les minutes et secondes sont complétées par 0 respectivement ; une partie est constituée des minutes et des secondes obtenues par respectivement, sans supplémentation 0.

Figure 2 : Cette image montre le fonctionnement des deux méthodes sur IE11. Il y a un problème. La partie ci-dessus est traitée par toLocaleTimeString() Après avoir ajouté 0 aux minutes et secondes respectivement, un espace est ajouté au début de et à gauche et à droite de " : " , , ce qui entraîne l'allongement de la longueur de la chaîne entière de l'original 8 à 13, ce qui conduit au résultat du substr (index,length) étant différent de celui attendu Incohérent ; dans la partie inférieure, puisque les heures, les minutes et les secondes sont obtenues séparément, bien qu'il n'y ait pas de remplissage 0, la chaîne est épissée par nous-mêmes , et il n'y a aucun problème pour ajouter des espaces, donc substr(index, length) Les résultats de la méthode sont conformes aux attentes et nous pouvons obtenir la chaîne que nous voulons.

Figure 3 : Cette image montre le fonctionnement des deux méthodes sur Google Lorsque heures, minutes et secondes dépassent toutes 10 , le résultat affiché est de caractères. les longueurs des chaînes et des données sont cohérentes .

Figure 4 : Cette image montre le fonctionnement des deux méthodes sur IE11 Lorsque les heures, les minutes et les secondes dépassent 10, la chaîne de résultat affichée est la même. est en fait différent de La différence de longueur entre les deux est due à l'espace ajouté par toLocaleTimeString() .

Figure 5 : Cette image montre les deux méthodes exécutant substr(index, length) sur Google Puisque la longueur des données est la même que , donc l'est. obtenu La chaîne est la même que .

Figure 6 : Cette image montre le fonctionnement de substr(index, length) sur IE11 par les deux méthodes Puisque la longueur des données est incohérente , donc . est obtenu Les chaînes sont également différentes .

Enfin, pour les heures, minutes et secondes obtenues individuellement, c'est-à-dire les résultats obtenus par les trois méthodes getHours(), getMinutes() et getSeconds(), si est inférieur à "dix", Il existe des différences de formats avec d'autres formats, il vous suffit donc de porter jugements et de compléter .

function hou_min_sec(){var date = new Date();var hou = date.getHours().toString();var min = date.getMinutes().toString();var sec = date.getSeconds().toString();if(hou.length == 1){ //通过判定各个变量的长度(先将它们的值转化为字符串格式)，来确定它们是否不足十hou = "0" + hou; //反正它们最后都是以字符串形式拼接，所以我认为这样补"0"最简单}else if(min.length == 1){
            min = "0" + min;
        }else if(sec.length == 1){
            sec = "0" + sec;
        }var hou_min_sec = hou +":"+ min +":"+ sec;
        console.log(hou_min_sec,hou_min_sec.length);for(var i= 0; i<hou_min_sec.length; i++){
            console.log(hou_min_sec[i]);
        }var substr = hou_min_sec.substr(0,6);
        console.log(substr);
    }

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!