usage of MutationObserver to manipulate and set 'type' property of an input element loaded dynamically

荒凉一梦 提交于 2019-12-11 15:16:23

问题


I had a question earlier here which got me to this stage to ask another question:

Summary of what I am trying to achieve:

I am trying to use MutationObserver to keep a watch on my document and then change the 'type' of input element loaded dynamically.

Incomplete Code and needs help:

var observer = new MutationObserver(function (mutations)
           {
             mutations.forEach(function (mutation)
             {
               console.log(mutation.type);

             // here I need to get all elements with class "GTnumeric" and 
             // change its "type" to be "tel" if its not "hidden"

             // **please help me out here**
                       // TRIED CODE 

             });
            });

  var config = {
  childList: true,
  subtree: true
  };

 // Node, config
 var targetNode = document.body;

 // or would you rather suggest me to try
 var targetNode = document.getElementsByClassName(".GTnumeric");


 // setting the observer
 observer.observe(targetNode, config);

I am not sure how to iterate through the returned mutation inside for loop. I tried below in the place of CODE mentioned in the above snippet and I got: [Uncaught TypeError: t[i].getAttribute is not a function]

TRIED CODE

var elems = document.getElementsByClassName(".GTnumeric");
for (var el in elems) {
    if (elems[el].getAttribute("type") != 'hidden') {
        elems[el].setAttribute("type", "tel");
    }
}

Please guide me further as I am not sure how to use MotationObserver effectively. Thanks for your help!

来源:https://stackoverflow.com/questions/51792466/usage-of-mutationobserver-to-manipulate-and-set-type-property-of-an-input-elem

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!