Question

我制作了一个IDE（使用<textarea>和CodeMirror），如下所示：

在左侧，有一个div，其中包含行计数器。
所以我想做的就是获取最后的行号（上图中的12）。

这是我的代码：

$(document).ready(function() {    
    $(document).keydown(function() {
        let element = document.getElementsByClassName("CodeMirror-linenumber");
        element = element.item(element.length - 1);
        escape(element);
        let num = "";
        num = parseInt(element);
        console.log(num);
    });
});

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script src="array.js" type="text/javascript"></script>
        <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.32.0/codemirror.min.css"/>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.52.2/codemirror.min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.52.2/mode/xml/xml.min.js"></script>
    </head>
    <body>
        <textarea id="editor"></textarea>
        <script>
            var myCodeMirror = CodeMirror.fromTextArea(document.getElementById("editor"), {
                  mode: "xml",
                  htmlMode: true,
                  lineNumbers: true
            });
        </script>
    </body>
</html>

问题是，当我在Chrome上运行它时，它会给我输出"NaN"。

我知道已经问过这个问题，但是我没有找到满意的答案。

Answer 1

没有理由让您使用escape(element)。实际上，无论如何都已弃用它。您正在做的只是将元素编码为某种不需要的十六进制字符串。

您想要的只是访问元素的innerText属性，并使用parseInt(element.innerText)或更好的unary plus operator，+element.innerText来获取行号：

$(document).ready(function() {    
    $(document).keydown(function() {
        let element = document.getElementsByClassName("CodeMirror-linenumber");
        element = element.item(element.length - 1);
        console.log(+element.innerText);
    });
});

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script src="array.js" type="text/javascript"></script>
        <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.32.0/codemirror.min.css"/>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.52.2/codemirror.min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.52.2/mode/xml/xml.min.js"></script>
    </head>
    <body>
        <textarea id="editor"></textarea>
        <script>
            var myCodeMirror = CodeMirror.fromTextArea(document.getElementById("editor"), {
                  mode: "xml",
                  htmlMode: true,
                  lineNumbers: true
            });
        </script>
    </body>
</html>

parseInt返回非数字（NaN）

1 个答案: