检查 HTML 元素是否为 HTML 媒体元素

Question

我正在构建一个辅助函数来将元素插入 DOM。这是我目前所拥有的：

function insertElem(numberOfElems, elemTag, elemId, elemClass, parentSelector){
/*
* numberOfElements:-    Pass in a plain whole integer.
* elemId:-              Pass in a name for the element id (inside "" or ''),
                        an integer is appended to the id name by the for loop.               
* elemTag:-             Pass in the element tag type (inside "" or '').                   
* parentSelector:-      Pass in the identifier of the parent element (inside "" or '')
                        *querySelector prefixes:    # = id
                                                    . = class
                                                    none = tag               
*/      
  if (numberOfElems > 1) {
    for (i = 0; i < numberOfElems; i++) {
      var elem = this[elemId + i];
      elem = document.createElement(elemTag);
      elem.id = elemId + '_' + i;
      elem.className = elemClass;
      parentEl = document.querySelector(parentSelector);
      parentEl.appendChild(elem);
    }
  } else {
    var elem = this[elemId];
    elem = document.createElement(elemTag);
    elem.id = elemId;
    elem.className = elemClass;
    parentEl = document.querySelector(parentSelector);
    parentEl.appendChild(elem);
  }
}

我希望能够检查 "elem" 是否是一个 HTML 媒体元素，以便我可以向我的函数添加一个参数 ("elemSrc")。

伪代码：

if (elem is an html media element) {
   elem.src = media url;
}

Answer 1

你可以直接使用instanceof to see if it is an HTMLMediaElement

console.log(document.getElementById('test1') instanceof HTMLMediaElement)
console.log(document.getElementById('test2') instanceof HTMLMediaElement)

<video id="test1"></video>
<div id="test2"></video>

Answer 2

根据上面 Dave 的回答，HTMLMediaElement 是 HTMLAudioElement 和 HTMLVideoElement 的基础 class，所以如果您想检查特定类型的媒体，您也可以使用 instanceof 各自提到的类型来做到这一点。

Answer 3

感谢 Dave 的提示，这就是我现在想要的：-

function insertElem(numberOfElems, elemTag, elemId, elemClass, parentSelector, elemSrc){
    /*
    * numberOfElements:-    Pass in a whole integer.
    * elemTag:-             Pass in the element tag type (inside "" or '').              
    * elemId:-              Pass in a name for the element id (inside "" or ''),
                            an integer is appended to the id name by the for loop.
    * elemClass:-           Pass in a name for element class (inside "" or '').
    * parentSelector:-      Pass in the identifier of the parent element (inside "" or '')
                            * querySelector prefixes:    # = id
                                                         . = class
                                                         none = tag 
    *elemSrc:-              Pass in the source media url (inside "" or ''). 
    */      
      if (numberOfElems > 1) {
        for (i = 0; i < numberOfElems; i++) {
          var elem = this[elemId + i];
          elem = document.createElement(elemTag);
          elem.id = elemId + '_' + i;
             if (elemClass) {
                elem.className = elemClass;
             }
          parentEl = document.querySelector(parentSelector);
          parentEl.appendChild(elem);
            if(elem instanceof HTMLMediaElement) {
                elem.src = elemSrc;
            }
        }
      } else {
        var elem = this[elemId];
        elem = document.createElement(elemTag);
        elem.id = elemId;
            if (elemClass) {
                elem.className = elemClass;
            }
        parentEl = document.querySelector(parentSelector);
        parentEl.appendChild(elem);
           if(elem instanceof HTMLMediaElement) {
                elem.src = elemSrc;
          }
      }
    }

检查 HTML 元素是否为 HTML 媒体元素

Check if an HTML element is an HTML media element

html

javascript

media