“HTMLElement”types的值不存在属性“值”
我正在打字打字，并试图创build一个脚本，将更新一个p元素作为文本input框中input。
该html看起来如下所示：
<html> <head> </head> <body> <p id="greet"></p> <form> <input id="name" type="text" name="name" value="" onkeyup="greet('name')" /> </form> </body> <script src="greeter.js"></script> </html> 和greeter.ts文件：
function greeter(person) { return "Hello, " + person; } function greet(elementId) { var inputValue = document.getElementById(elementId).value; if (inputValue.trim() == "") inputValue = "World"; document.getElementById("greet").innerText = greeter(inputValue); }
当我与tsc编译时，我得到以下“错误”：
/home/bjarkef/sandbox/greeter.ts(8,53): The property 'value' does not exist on value of type 'HTMLElement'
然而编译器确实输出了一个javascript文件，在chrome中工作得很好。
我怎么得到这个错误？ 我该如何解决？
此外，我可以在哪里查找哪些属性在'HTMLElement'根据打字稿有效？
请注意，我对JavaScript和打字稿很新，所以我可能会漏掉一些明显的东西。 🙂
基于Tomasz Nurkiewiczs的回答，“问题”是打字稿是types安全的。 :)所以document.getElementById()返回不包含value属性的HTMLElementtypes。 子typesHTMLInputElement不包含value属性。
所以一个解决scheme是将getElementById()的结果投射到HTMLInputElement如下所示：
var inputValue = (<HTMLInputElement>document.getElementById(elementId)).value;
在打字稿中是铸造操作员。 看到问题的TypeScript：铸造HTMLElement 。
从上面的行产生的JavaScript看起来像这样：
inputValue = (document.getElementById(elementId)).value;
即不包含types信息。
尝试将您想要更新的元素转换为HTMLInputElement。 正如其他答案中所述，您需要向编译器提示这是一个特定types的HTMLElement：
var inputElement = <HTMLInputElement>document.getElementById('greet'); inputElement.value = greeter(inputValue);
问题在这里：
document.getElementById(elementId).value
你知道从getElementById()返回的HTMLElement实际上是一个HTMLInputElement的实例，它inheritance于它，因为你正在传入一个input元素的ID。 类似的静态types的Java，这将不会编译：
public Object foo() { return 42; } foo().signum();
signum()是Integer一个方法，但编译器只知道foo()的静态types，即Object 。 而Object没有signum()方法。
但是编译器无法知道，它只能基于静态types，而不是dynamic的代码行为。 就编译器所知， document.getElementById(elementId)expression式的types没有value属性。 只有input元素才有价值。
对于MDN中的引用检查HTMLElement和HTMLInputElement 。 我认为Typescript或多或less与这些一致。
这个快速解决方法是使用[]来select属性。
function greet(elementId) { var inputValue = document.getElementById(elementId)["value"]; if(inputValue.trim() == "") { inputValue = "World"; } document.getElementById("greet").innerText = greeter(inputValue); }
我只是尝试一些方法，找出这个解决scheme，
我不知道原始脚本背后有什么问题。
作为参考，你可以参考Tomasz Nurkiewicz的post。
如果你正在使用反应，你可以使用as运算符。
let inputValue = (document.getElementById(elementId) as HTMLInputElement).value;
问题：
错误属性“文本”不存在types“HTMLElement”
解决scheme：在typeScript中，我们需要投射document.getElementById() ，它返回< HTMLScriptElement > HTMLElementtypes
所以我们可以通过按照下面的方式来解决错误，正如所期望的typescript.js
Code: var content: string = ( < HTMLScriptElement > document.getElementById(contentId)).text;
它为我工作..希望它也适用于你。
