document.getElementById（'myID'）和jQuery元素的JSDoc类型是什么？

Question

我正在尝试使用JSDoc语法记录我的函数。

/**
 * 
 * My Description
 * 
 * @param {JQuery|???} input
 * @returns {JQuery}
 */
function foo(input){
    return $('selector');
}

上面的函数接受一个参数，该参数可以是JQuery对象，也可以是document.getElementById返回的元素。

getElementById的返回值的有效JSDoc类型是什么？

例如，以下两者都有效：

foo($('#input'));
foo(document.getElementById('input'));

此外，我将来在哪里可以找到这个？

Answer 1

getElementById将始终返回Element的子类型。 对于HTML文档， HTMLElement将更合适

document.getElementById('some-anchor').constructor //HTMLAnchorElement
document.getElementById('some-div').constructor //HTMLDivElement

在所有情况下， document.getElementById('some-element') instanceof HTMLElement将恕我直言，返回true

Answer 2

虽然技术上getElementById的返回值是object ，但文档应该帮助开发人员知道它是什么。

我个人会选择Element但没有迹象表明你应该使用什么。

Answer 3

在您的场景中， Element似乎是最合适的，但一般来说，您希望像您的代码所允许的那样准确。

例如，使用最新的高级IDE，使用Element不会为disabled或readOnly等属性提供自动完成功能。 我觉得使用例如HTMLInputElement @type很有用。

Answer 4

HTMLElement或any可以在您的示例中使用。

/**
 * @param {JQuery|HTMLElement} input
 * @returns {JQuery}
 */
function foo(input){
    return $('selector');
}

Answer 5

getElementById()也将返回一个javascript对象。

在jQuery中 - > $（'#input'）只是将带有输入id的元素包装到jQuery对象中，以便可以在其上应用jQuery方法。

所以在这两种情况下，类型都是一个对象。

var x = document.getElementById('input');

alert(typeof x);// object