Check if an HTML element is expecting a source attribute

Question

Following on from my previous question. I made a helper function(see below), to insert elements into the DOM. Part of the function uses 'instanceof' to determine if 'this' element is an instance of an HTMLMediaElement and determines the source attribute by way of the argument 'elemSrc'.

My question: Is there a way to check if an element is 'expecting' a source attribute to be defined? The reason I ask is, I could then use this function for all elements that 'expect' to have a source attribute defined. I know I could use instanceof & reel off every element that employs the source attribute, but I would prefer a slicker way if possible.

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;
          }
      }
    }

Answer 1

You can check if src exists as a key in the HTML Element.

if('src' in elem){
   //src is a valid attribute for elem
}

Demo:

<label>Element Type: <input type="text" id="elemType"/></label>
<br/>
<button id="process">
Process
</button>
<p id="result">
</p>
<script>
var elemTypeInput = document.getElementById("elemType"), processBtn = document.getElementById("process"), res = document.getElementById("result");
processBtn.addEventListener("click", function(e){
	var elemType = elemTypeInput.value;
  if(!elemType.trim()){
  	res.textContent = "Element Type can not be empty!";
  } else {
    try{
    var elem = document.createElement(elemType);
    var hasSrc = 'src' in elem;
    res.textContent = elemType + " element has src attribute: " + hasSrc;
    } catch(e){
    	res.textContent = "Please enter a valid element type.";
    }
    }
});
</script>

Answer 2

Here's the updated function:

function insertElem(numberOfElems, elemTag, elemId, elemClass, parentSelector, elemSrc){
/*
* numberOfElements:-    Pass in a whole integer.
* elemTag:-             Pass in the element tag type (as a string).              
* elemId:-              Pass in a name for the element id (as a string),
                        an integer is appended to the id name by the for 
                        loop.
* elemClass:-           Pass in a name for element class (as a string).
* parentSelector:-      Pass in the identifier of the parent element 
                        (as a string).
                        * querySelector prefixes:    # = id
                                                     . = class
                                                     none = tag 
*elemSrc:-              Pass in the source media url (as a string). 
*/      
  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('src' in elem) {
            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('src' in elem) {
            elem.src = elemSrc;
      }
  }
}