从字符串中检测CSS选择器的类型

Detecting the type of CSS selector from a string

本文关键字:选择器 类型 CSS 检测 字符串      更新时间:2023-09-26

我有一些JSON,其中包含数千种不同的CSS选择器,下面是各种示例…

"#mid_ad_title",
"#mid_mpu",
"#mid_roll_ad_holder",
".SidebarAdvert",
".SitesGoogleAdsModule",
".SkyAdContainer",
"a[href$='"/vghd.shtml'"]",
"a[href*='"/adrotate/adrotate-out.php?'"]",
"a[href^='"http://ad-apac.doubleclick.net/'"]",
"#mn #center_col > div > h2.spon:first-child + ol:last-child",
"#resultspanel > #topads",
"#rhs_block > #mbEnd"
如你所见,JSON是由多种选择器组成的——有些只是一个类,有些只是一个ID,还有一些是混合选择器。

我想根据选择器的类型使用相关的JavaScript"get"方法,所以对于只是id的选择器,我会使用document.getElementById()等。

有没有人知道任何正则表达式或东西,将告诉我选择器的类型,当我通过JSON循环?即"class", "id", "other"

我想你会在switch中找到更多的用途:

var results = [];
for(var i = 0; i < selectors.length; i++){
    var s = selectors[i];
    if( s.indexOf(' ') !== -1){
        s = s.substring(0, s.indexOf(' '));
    }
    switch(selectors[i][0]){
        case '#': // ID
        results.push(document.getElementById(s.substr(1)));
        break;
    case '.': // Class
        results.push(document.getElementsByClassName(s.substr(1)));
        break;
    default: // Tag
        results.push(document.getElementsByTagName(s));
        break;
    }
}

然而唯一可靠的解决方案是使用:

document.querySelectorAll(selector);