JavaScript：输入指定类型的选择器(仅需支持id，class，tagName三种简单CSS选择器)

问题描述

1.编写一个JavaScript函数，输入指定类型的选择器(仅需支持id，class，tagName三种简单CSS选择器，无需兼容组合选择器)

问题是：下面的正则匹配看不懂，var reg = /^(#)?(.)?(w+)$/img;var regResult = reg.exec(selector);,具体如下

var query = function(selector) {var reg = /^(#)?(.)?(w+)$/img;var regResult = reg.exec(selector);var result = [];//如果是id选择器if(regResult[1]) { ...}//如果是class选择器else if(regResult[2]) { ... }//如果是标签选择器else if(regResult[3]) { ... }}

问题解答

/^(#)?(.)?(w+)$/img拆一下 //之间的是正则的内容 后面img是正则的匹配方式i：ignorCase忽略大小写m：mutiple允许多行匹配g：globle进行全局匹配，指匹配到目标串的结尾

正则内容：^(#)?(.)?(w+)$ ^代表以xxx开头 $代表以xxxx结尾(#)?可以带一个或者不带#(.)? 可以带.或者没有.(w+) 匹配一个或多个单词

/^(#)?(.)?(w+)$/img

(#)? 匹配ID的

(.)? 匹配className

(w+) 剩下都是标签名或者[1,2]中具体的ID或者className名称

谢遥。

请参考 @trionfo1993

给你一个，我写的utils中的dom片段

class dom extends base{ constructor(){super(); } // 根据ID获取指定DOM byId(_id){return document.getElementById(string.replace(_id,’#’,’’)); } // 根据ID或Class获取DOM get(_id){if(_id.indexOf(’.’) > -1){ let list = document.getElementsByClassName(string.replace(_id,’.’,’’)); this._object = Array.from(list);}else{ this._object = [this.byId(_id)];}return this; } // 根据Name获取相关DOM byName(_name){let list = document.getElementsByName(_name);if(list.length > 0) return Array.from(list);return null; } // 返回dom原型 get valueOf(){if(this._object.length >1){ return this._object; }return this._object[0]; } // 基础DOM操作方法 _dom_ctrols(_func){for(let info of this._object){ _func(info);}return this; } // 增加class addClass(_name){this._dom_ctrols((info)=>{ if(info.className.indexOf(_name) == -1){info.className += ’ ’ + _name; }})return this; } // 删除class removeClass(_name){this._dom_ctrols((info)=>{ info.className = string.replace(info.className,_name,’’);})return this; } // 显示？隐藏DOM主方法 _hide_show(_value){this._dom_ctrols((info)=>{ info.style.display = _value;}); } // 隐藏DOM hide(){this._hide_show(’none’); } // 显示DOM show(){this._hide_show(’block’); }