Using DOM events to print the count of document.createElement calls in javascript

Question

As per this post Log a web page's dynamically-created tag attributes with a userscript

i retrieved the attributes and also included the array as suggested like

addJS_Node ("var arr=[];");

i successfully pushed the src attributes to arr array because i didn't get any error.

Now i am confused where to display the array.

My code is as follows

// ==UserScript==
// @name        Tags Monitoring
// @namespace   PC
// @run-at      document-start
// ==/UserScript==
//--- Intercept and log document.createElement().tagattributes
addJS_Node ("var arr=[];"); 
function LogNewTagCreations ()
{   
   var oldDocumentCreateElement = document.createElement;
  document.createElement       = function (tagName) 
  {
      var elem = oldDocumentCreateElement.apply (document, arguments);  
      if(tagName=='script')      
         GetScriptAttributes (elem); 
     return elem;
  }   
}
function GetScriptAttributes (elem, tagNum, timerIntVar) 
{
   /*--- Because the tags won't be set for some while, we need
    to poll for when they are added.
   */       
   GetScriptAttributes.tagNum  = GetScriptAttributes.tagNum || 0;
   if ( ! tagNum) 
   {
       GetScriptAttributes.tagNum++;
       tagNum = GetScriptAttributes.tagNum;
   }   
   /*-- Getting the required attributes */
   if (elem.src) 
   {
      doneWaiting ();
      arr.push(elem.src);
        console.log (
        tagNum," has a src attribute of:", elem.src,"=========",arr.length
        );
   }    
   else 
   {
    if ( ! timerIntVar) 
    {
        var timerIntVar = setInterval 
        (
            function () 
            {
                GetScriptAttributes (elem, tagNum, timerIntVar);

            },
            50
        );            
    }        
}    
function doneWaiting () 
{
    if (timerIntVar) 
    {
        clearInterval (timerIntVar);
    }       
}    
}
 /*--- The userscript or GM script will start running before the DOM is available.
   Therefore, we wait...
  */
  var waitForDomInterval = setInterval (
  function () {
    var domPresentNode;
    if (typeof document.head == "undefined")
        domPresentNode = document.querySelector ("head, body");
    else
        domPresentNode = document.head;       
    if (domPresentNode) {
        clearInterval (waitForDomInterval);            
        addJS_Node (GetScriptAttributes.toString() );                    
        addJS_Node (null, null, LogNewTagCreations);
    }
},
1  
);

 addJS_Node("document.onreadystatechange = function (){if (document.readyState ==       'complete'){console.log(arr.length);}}");

//--- Handy injection function.
function addJS_Node (text, s_URL, funcToRun) {
var D                                   = document;
var scriptNode                          = D.createElement ('script');
scriptNode.type                         = "text/javascript";
if (text)       scriptNode.textContent  = text;
if (s_URL)      scriptNode.src          = s_URL;
if (funcToRun)  scriptNode.textContent  = '(' + funcToRun.toString() + ')()';
var targ = D.getElementsByTagName ('head')[0] || D.body || D.documentElement;
targ.appendChild (scriptNode);    
}

I want to print the number of tags created dynamically that is why i added array. I first tried with script tags only and how can i know the array is completed and so that i can print the array length

Answer 1

Looks like your problem is not with your code.
You simply dont know javascript at all.

I strongly recommend you start with simple codes and tutorials.
Try to code your first script.
If you have any doubt about your code, feel free to come and ask about it.

The code that Brock Adams gave you is working perfectly.
I just copy-pasted it into Greasemonkey.
Here is the output:

And please go back to Log a web page's dynamically-created tag attributes with a userscript and mark his answer as the right one.