javascript - Vs code .value is not recognized by intellisense - Stack Overflow

I am very new to javascript, but as I was working I was trying to figure out a way to get the text a us

I am very new to javascript, but as I was working I was trying to figure out a way to get the text a user would input into an html input text box, but for some reason vs code does not recognize the intellisense required to do this.

My HTML code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <input type="text" id="first-input">
    <button id="submit-button">Submit</button>
    <script src="main.js" type="text/javascript"></script>
</body>
</html>

The JavaScript:

let firstInput = document.getElementById('first-input');
let submitButton = document.getElementById('submit-button');

submitButton.onclick = function () {
    console.log(firstInput.value);
}

In order to get the data inside an input text element, the code for that is .value, however when i start typing ".val-" the only remendation VS code has is for .nodeValue.

This means, in order to get what I want, I am using a mand that the intellisense for vs code doesn't recognize. However, even though intellisense does not find it, the code still operates as intended.

Is there something I need to install or do to get access to this information? I am concerned there are many other things it doesn't recognize and will make learning this language more difficult. Thanks in advance

I am very new to javascript, but as I was working I was trying to figure out a way to get the text a user would input into an html input text box, but for some reason vs code does not recognize the intellisense required to do this.

My HTML code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <input type="text" id="first-input">
    <button id="submit-button">Submit</button>
    <script src="main.js" type="text/javascript"></script>
</body>
</html>

The JavaScript:

let firstInput = document.getElementById('first-input');
let submitButton = document.getElementById('submit-button');

submitButton.onclick = function () {
    console.log(firstInput.value);
}

In order to get the data inside an input text element, the code for that is .value, however when i start typing ".val-" the only remendation VS code has is for .nodeValue.

This means, in order to get what I want, I am using a mand that the intellisense for vs code doesn't recognize. However, even though intellisense does not find it, the code still operates as intended.

Is there something I need to install or do to get access to this information? I am concerned there are many other things it doesn't recognize and will make learning this language more difficult. Thanks in advance

Share Improve this question edited Apr 23, 2022 at 10:11 Jake Boone 1,3902 gold badges13 silver badges26 bronze badges asked Mar 20, 2019 at 22:46 HuebsHuebs 451 silver badge3 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 7

This is because getElementById() doesn't necessarily return an element with a .value property. For example, it could return a <div> element.

In order for the intellisense to know that you will have a .value property, you have to indicate with a JSDoc ment that the variable firstInput is going to be an <input> element. Like this:

/**
 * @type HTMLInputElement
 */
let firstInput = document.getElementById('first-input');
/**
 * @type HTMLButtonElement
 */
let submitButton = document.getElementById('submit-button');

submitButton.onclick = function () {
  console.log(firstInput.value);
}

Not to confuse you, but VSCode uses TypeScript to power its intellisense, even for JavaScript code.

发布者:admin,转转请注明出处:http://www.yc00.com/questions/1745350377a4623795.html

相关推荐

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信