封装自己的getClassName函数

Posted 2020-07-26 double2014

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了封装自己的getClassName函数相关的知识，希望对你有一定的参考价值。

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>getClessName</title>
 </head>
 <body>
  

  <input type="submit" id = "sub" class="ss confirm btn" value="提交"/>

  <script>

        
    window.onload = function(){

        var Opt = document.getElementById(‘sub‘);

        var getClass = function(className,tagName){
            

            if(document.getElementsByTagName){
                
                var Inp = document.getElementsByTagName(tagName);
                for(var i=0; i<Inp.length; i++){

                    if((new RegExp(‘(\\s|^)‘ +className +‘(\\s|$)‘)).test(Inp[i].className)){
                        
                        return Inp[i];
                    }
                
                }
                
            }else if(document.getElementsByClassName){
                return document.getElementsByClassName(className);
            }
        }
        
        //alert(getClass("confirm", "input"));
        var aa = getClass("confirm", "input");
        //alert(Inp);
        //alert(Inp);

        function getClass(className, targetName){
            var ele = [];
            var all = document.getElementsByTagName(targetName || "*");
            for(var i=0; i<all.length; i++){
                if(all[i].className.match(new RegExp(‘(\\s|^)‘+confirm+‘(\\s|$)‘))){
                    
                    ele[ele.length] = all[i];
                
                }
            }
            return ele;
        }

        function getObjsByClass(tagName, className){
        
            if(document.getElementsByClassName){
                alert("document.getElementsByClassName");
                return document.getElementsByClassName(className);
            }else{
                var el = [];
                var _el = document.getElementsByTagName(tagName);
                for(var i=0; i<_el.length; i++){
                
                    if(_el[i].className.indexOf(className) > -1){
                        alert(_el[i]);
                        el[_el.length] = _el[i];
                    }
                }
                alert(el);
                return el;
            }
        }


        function addEvent(ev, type){
            var ev = ev || window.event;
            if(ev.addEventListener){
                
                ev.addEventListener(type, function(){
                    alert(ev.type);
                }, false);
            }else if(ev.attachEvent){
                
                ev.attachEvent("on" + type, function(){
                alert("ev.attachEvent");
                    
                });
            }
        }


    /*var getClass = function (className, parentNode) {

         var node = null;
         var temps = [];
         if (parentNode != undefined) {
             node = parentNode;
         } else {
            node = document;
         }
         if(node.getElementsByTagName){
             var all = node.getElementsByTagName(‘*‘);
             for (var i = 0; i < all.length; i ++) {
              if ((new RegExp(‘(\\s|^)‘ +className +‘(\\s|$)‘)).test(all[i].className)) {
                  temps.push(all[i]);
               }
           }
             return temps;
         }else{
            if(node.getElementsByClassName){
            
                return document.getElementsByClassName(className);
            }
         }
     }*/


        //alert(getClass("confirm"));
        //var obj = getClass("confirm","input");
        //alert(obj);
        //alert(Opt);
        addEvent(aa, ‘click‘);

        
    }
  </script>
 </body>
</html>

以上是关于封装自己的getClassName函数的主要内容，如果未能解决你的问题，请参考以下文章

常用Javascript代码片段集锦

VSCode自定义代码片段14——Vue的axios网络请求封装

Java 封装