javascript NaN issue

javascript NaN issue

本文关键字:issue NaN javascript      更新时间:2023-09-26

我需要写一个代码,将大于10个字母的单词缩写为:localization -> l10n。我用javascript来做这个,但是一个NaN错误。

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Way Too Long Words</title>
</head>
<body>
       <input type="text">
       <button>abbreviate</button>
       <div id="result"></div>
<script>
    var word = document.querySelector('input').value.split('');
    document.querySelector("button").onclick = function () {
    "use strict";
    var theResult = word[0] + word.slice(1, -1).length + word[word.length - 1];
        document.getElementById("result").innerHTML = theResult;
};
</script>
</body>
</html>

如何克服这个问题

我看到你的代码有两个主要问题:

  1. 当前仅在加载文档时设置一次word的值。

  2. 你目前没有检查word超过10个字母,并尝试计算theResult不管

以上两个问题的结合意味着word在页面加载时被设置为空字符串,并且单击按钮将始终导致theResultNaN