JS和querySelectorAll

Question

def all_dates_between?(dates, lower_limit, upper_limit) dates.all? { |date| date.between?(lower_limit, upper_limit) } end >> dates = ['2018-03-28', '2018-02-28', '2018-02-18'] >> lower_limit = '2018-01-01' >> upper_limit = '2018-03-28' >> all_dates_between?(dates, lower_limit, upper_limit) #> true 问题，很可能是一个愚蠢的问题，但我没有看到解决方案。

我有类似以下的内容

querySelectorAll

我希望选择所有且只有那些没有<div id="main_0"> ... </div> <div id="main_1"> ... </div> <div id="main_1_minor"> ... </div> <div id="main_2"> ... </div> <div id="main_2_minor"> ... </div> . . 的div。

我试过

minor

但显然这还不够。我不知道如何通过RegEx制定id值必须以数字终止。我试过像var pattern = new RegExp('^main_\\d'); var elSelected = document.querySelectorAll('div[id^=main_]'); elSelected.filter(elt => pattern.test(elt.id))); 这样的东西，但我做得不对。

Answer 1

您可以使用:not()选择器，＆＃34;属性以＆＃34;结尾选择器。

"div:not([id$=minor])"

如果它还应验证id是否以main_开头，那么您也可以在问题中显示该内容。

"div[id^=main_]:not([id$=minor])"

因此，这表示＆＃34;选择div以id开头并且不以main_开头的所有minor元素＆＃34; < / em>的

如果minor不一定在最后，那么您可以将id*=minor用于＆＃34;包含＆＃34;代替。

＆＃13;

＆＃13;

document.querySelectorAll("div[id^=main_]:not([id$=minor])")
  .forEach(el => el.style.color = "red");

＆＃13;

<div id="main_0"> main </div>
<div id="main_1"> main </div>
<div id="main_1_minor"> main ends with minor </div>
<div id="main_2"> main </div>
<div id="main_2_minor"> main ends with minor </div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

过滤器不适用于NodeList，首先转换为数组。此外，如果您已经选择了所有main div，那么最简单的正则表达式就足够了。

＆＃13;

＆＃13;

var pattern = new RegExp(/\d+$/);
var elSelected = Array.prototype.slice.call(document.querySelectorAll('div[id^=main_]'));

elSelected.filter(elt => pattern.test(elt.id)).forEach(function(elt){
	elt.style.backgroundColor = "yellow";
});

＆＃13;

<div id="main_0">main_0</div>
<div id="main_1">main_1</div>
<div id="main_1_minor">main_1_minor</div>
<div id="main_2">main_2</div>
<div id="main_0_minor">main_0_minor</div>

＆＃13;

＆＃13;

＆＃13;