获取标签的所有选择器存放在一个数组

1.引入jQuery

1 <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js"></script>

将上面这段代码引入html。

 

2.写一个方法

 1 function $selector(tag){
 2     var el=$(tag).toArray();
 3     var els=el.map(function(element,index){
 4     var obj={}
 5     if(element.className&&element.id){
 6         obj.id=`#${element.id}`;
 7         obj.class=`.${element.className.replace(/ /g,',.')}`.split(',');
 8         return obj;
 9     }
10     else if(element.className){
11         obj.class=`.${element.className}`;
12         return obj;
13     }
14     else if(element.id){
15         obj.id=`.${element.id}`;
16         return obj;
17     }
18     });
19     return els;
20 }

3.调用该方法

通过$seleclor('标签名')使用该方法。

例如：

1 $selector('div');        //获取页面所有div的选择器，每个div的id和class选择器会分开存放
2     
3 $selector('p');          //获取页面所有p标签的选择器
4 
5 $selector('a');          //获取页面所有a标签的选择器        

控制台实现效果图：