如何遍歷 html 元素原型的屬性名稱？

Question

例如，我可以通過使用迭代 Element.prototype 中的屬性

Object.getOwnPropertyNames(Element.prototype).forEach(/*does the thing*/)

但我似乎無法找到一種方法來遍歷“音頻”等元素的屬性。 例如，嘗試迭代 HTMLAudioElement 只會產生一個帶有 ["constructor"] 的數組，當它肯定有更多的屬性時。 有誰知道如何做到這一點？

更多背景：我正在嘗試構建一個將值傳遞給元素但觸發事件的代理類。 該類需要與它充當代理的元素具有相同的屬性。

Answer 1

HTMLAudioElement沒有特定屬性，因為它從其父級，HTMLMediaElement和HTMLElement繼承其屬性。

Object.getOwnPropertyNames(HTMLMediaElement)

輸出：

["length", "name", "arguments", "caller", "prototype", "NETWORK_EMPTY",
 "NETWORK_IDLE", "NETWORK_LOADING", "NETWORK_NO_SOURCE", 
 "HAVE_NOTHING", "HAVE_METADATA", "HAVE_CURRENT_DATA", 
 "HAVE_FUTURE_DATA", "HAVE_ENOUGH_DATA", "toString"]

https://developer.mozilla.org/en/docs/Web/API/HTMLAudioElement

正如@self在下面的評論中指出的那樣，你也可以使用：

Object.getOwnPropertyNames(HTMLAudioElement.__proto__)

獲得相同的結果，而不必知道HTMLAudioElement繼承自哪個類。

Answer 2

在 Firefox 中，我能夠使用 for in 獲取音頻元素的所有屬性。

for (let prop in Audio.prototype) {
    console.log(prop);
}

我用它來構建一個數組，然后我可以在 Chrome 和 Firefox 中使用它。

const audioProps = ["load", "canPlayType", "fastSeek", "play", "pause", "addTextTrack", "mozCaptureStream", "mozCaptureStreamUntilEnded", "mozGetMetadata", "setMediaKeys", "seekToNextFrame", "error", "src", "currentSrc", "crossOrigin", "networkState", "preload", "buffered", "readyState", "seeking", "currentTime", "duration", "paused", "defaultPlaybackRate", "playbackRate", "played", "seekable", "ended", "autoplay", "loop", "controls", "volume", "muted", "defaultMuted", "textTracks", "srcObject", "mozPreservesPitch", "mozAudioCaptured", "mozFragmentEnd", "mediaKeys", "onencrypted", "onwaitingforkey", "NETWORK_EMPTY", "NETWORK_IDLE", "NETWORK_LOADING", "NETWORK_NO_SOURCE", "HAVE_NOTHING", "HAVE_METADATA", "HAVE_CURRENT_DATA", "HAVE_FUTURE_DATA", "HAVE_ENOUGH_DATA", "click", "focus", "blur", "title", "lang", "dir", "innerText", "hidden", "accessKey", "accessKeyLabel", "draggable", "contentEditable", "isContentEditable", "spellcheck", "nonce", "offsetParent", "offsetTop", "offsetLeft", "offsetWidth", "offsetHeight", "oncopy", "oncut", "onpaste", "style", "onabort", "onblur", "onfocus", "onauxclick", "onbeforeinput", "oncanplay", "oncanplaythrough", "onchange", "onclick", "onclose", "oncontextmenu", "oncuechange", "ondblclick", "ondrag", "ondragend", "ondragenter", "ondragexit", "ondragleave", "ondragover", "ondragstart", "ondrop", "ondurationchange", "onemptied", "onended", "onformdata", "oninput", "oninvalid", "onkeydown", "onkeypress", "onkeyup", "onload", "onloadeddata", "onloadedmetadata", "onloadend", "onloadstart", "onmousedown", "onmouseenter", "onmouseleave", "onmousemove", "onmouseout", "onmouseover", "onmouseup", "onwheel", "onpause", "onplay", "onplaying", "onprogress", "onratechange", "onreset", "onresize", "onscroll", "onseeked", "onseeking", "onselect", "onstalled", "onsubmit", "onsuspend", "ontimeupdate", "onvolumechange", "onwaiting", "onselectstart", "ontoggle", "onpointercancel", "onpointerdown", "onpointerup", "onpointermove", "onpointerout", "onpointerover", "onpointerenter", "onpointerleave", "ongotpointercapture", "onlostpointercapture", "onmozfullscreenchange", "onmozfullscreenerror", "onanimationcancel", "onanimationend", "onanimationiteration", "onanimationstart", "ontransitioncancel", "ontransitionend", "ontransitionrun", "ontransitionstart", "onwebkitanimationend", "onwebkitanimationiteration", "onwebkitanimationstart", "onwebkittransitionend", "dataset", "tabIndex", "onerror", "getAttributeNames", "getAttribute", "getAttributeNS", "toggleAttribute", "setAttribute", "setAttributeNS", "removeAttribute", "removeAttributeNS", "hasAttribute", "hasAttributeNS", "hasAttributes", "closest", "matches", "webkitMatchesSelector", "getElementsByTagName", "getElementsByTagNameNS", "getElementsByClassName", "insertAdjacentElement", "insertAdjacentText", "mozMatchesSelector", "setPointerCapture", "releasePointerCapture", "hasPointerCapture", "setCapture", "releaseCapture", "getAttributeNode", "setAttributeNode", "removeAttributeNode", "getAttributeNodeNS", "setAttributeNodeNS", "getClientRects", "getBoundingClientRect", "scrollIntoView", "scroll", "scrollTo", "scrollBy", "insertAdjacentHTML", "querySelector", "querySelectorAll", "attachShadow", "requestFullscreen", "mozRequestFullScreen", "requestPointerLock", "animate", "getAnimations", "before", "after", "replaceWith", "remove", "prepend", "append", "replaceChildren", "namespaceURI", "prefix", "localName", "tagName", "id", "className", "classList", "part", "attributes", "scrollTop", "scrollLeft", "scrollWidth", "scrollHeight", "clientTop", "clientLeft", "clientWidth", "clientHeight", "scrollTopMax", "scrollLeftMax", "innerHTML", "outerHTML", "shadowRoot", "assignedSlot", "slot", "onfullscreenchange", "onfullscreenerror", "previousElementSibling", "nextElementSibling", "children", "firstElementChild", "lastElementChild", "childElementCount", "getRootNode", "hasChildNodes", "insertBefore", "appendChild", "replaceChild", "removeChild", "normalize", "cloneNode", "isSameNode", "isEqualNode", "compareDocumentPosition", "contains", "lookupPrefix", "lookupNamespaceURI", "isDefaultNamespace", "nodeType", "nodeName", "baseURI", "isConnected", "ownerDocument", "parentNode", "parentElement", "childNodes", "firstChild", "lastChild", "previousSibling", "nextSibling", "nodeValue", "textContent", "ELEMENT_NODE", "ATTRIBUTE_NODE", "TEXT_NODE", "CDATA_SECTION_NODE", "ENTITY_REFERENCE_NODE", "ENTITY_NODE", "PROCESSING_INSTRUCTION_NODE", "COMMENT_NODE", "DOCUMENT_NODE", "DOCUMENT_TYPE_NODE", "DOCUMENT_FRAGMENT_NODE", "NOTATION_NODE", "DOCUMENT_POSITION_DISCONNECTED", "DOCUMENT_POSITION_PRECEDING", "DOCUMENT_POSITION_FOLLOWING", "DOCUMENT_POSITION_CONTAINS", "DOCUMENT_POSITION_CONTAINED_BY", "DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC", "addEventListener", "removeEventListener", "dispatchEvent"];