Javascript未捕获TypeError：无法设置为空的属性'值'

Question

我之前在SO上检查过这个问题，无法根据其他问题给出的解决方案来解决此问题。

我是JavaScript新手，正在尝试创建一个将英里转换为公里的功能，并获得了以下功能。我想将此段落元素设置为转换的值。

<p id="kValue"></p> 

var kilometersElement = document.getElementById("kvalue"); 
var milesElement = document.getElementById("mValue"); 

function convert() { 
    var km = (milesElement.value * 1.61); 
    km.toFixed(2); 
    console.log(km); 
    document.getElementById("kvalue").innerHTML = kilometersElement; 
} 

它将km的值打印到控制台，但在尝试执行下面的命令行时出现以下错误。

Uncaught TypeError: Cannot set property 'value' of null at convert (cmtk.js:41)

在第41行，我只是调用函数convert（）;

任何人都可以帮助我吗？

Answer 1

检查此链接，它会给你错误的答案。

Why does jQuery or a DOM method such as getElementById not find the element?

调用值的方式取决于在你的代码调用它的顺序。

也尝试初始化的值：

VAR kilometersElement

VAR milesElement

function convert(miles) { 
    return (miles * 1.61).toFixed(2); 
} 

var kilometersElement = document.getElementById("kValue"); 
var miles    = document.getElementById("mValue"); 

var kilometers = convert(miles); 
console.log(kilometers); 
kilometersElement.innerHTML = kilometers; 

Answer 2

最有可能的，你忘了给您的<input>元素的“id`属性和价值。

<p id="kValue"></p> 
<form> 
    <input id="mValue" type="text" value=""> 
</form> 

---

<script> 

    function convertMilesToKm(miles) { 
     return (miles * 1.61).toFixed(2); 
    } 

    var miles = document.getElementById("mValue").value; //assuming textbox 
    var km = convertMilesToKm(miles); 

    console.log(km); 
    document.getElementById("kvalue").innerHTML = km; 

</script> 

OR

<script> 

    function showOutput(results, outputElement){ 
     console.log(results); 
     outputElement.innerHTML = results; 
     return; 
    } 

    function convertMilesToKm(miles) { 
     return (miles * 1.61).toFixed(2); 
    } 

    var km = convertMilesToKm(document.getElementById("mValue").value); 
    showOutput(km, document.getElementById("kvalue")); 

</script> 

，或者可能

<output id="kValue"></output> <!-- HTML5.x only --> 
<form> 
    <input id="mValue" type="text" value=""> 
</form> 

<script> 

    function showOutput(results, outputElement){ 
     console.log(results); 
     outputElement.innerHTML = results; 
     return; 
    } 

    function convertMilesToKm(miles) { 
     return (miles * 1.61).toFixed(2); 
    } 

    showOutput(convertMilesToKm(document.getElementById("mValue").value), 
              document.getElementById("kvalue")); 

</script>