2016-12-01 5 views
0

Я программирую WebExtension для Facebook, который будет ссылаться на CSS на основе их настроек конфиденциальности.Как запустить цикл for внутри селектора jQuery?

$(document).ready(function(){ 
    $("a[data-tooltip-content*='Public']").closest(".userContentWrapper._5pcr").css({"background-color": "yellow"}); 
    $("a[data-tooltip-content*='Only Me']").closest(".userContentWrapper._5pcr").css({"background-color": "lime"}); 
    $("a[data-tooltip-content*='friends']").closest(".userContentWrapper._5pcr").css({"background-color": "cyan"}); 
    $("a[data-tooltip-content*='Public']").closest("._2tdc").css({"background-color": "yellow"}); 
    $("a[data-tooltip-content*='Only Me']").closest("._2tdc").css({"background-color": "lime"}); 
    $("a[data-tooltip-content*='friends']").closest("._2tdc").css({"background-color": "cyan"}); 

Однако я заметил, что другой макет страницы являются имеет другое значение класса, что мне нужно для вызова с CSS кодов.

Есть ли способ написать цикл for внутри селектора jQuery?

$("a[data-tooltip-content*='Public']").closest("**For(a list of class name), loop through all of them)**").css({"background-color": "yellow"}); 

Я попытался с помощью $.each JQuery, но я на самом деле не так много идей после прочтения документов.

var obj = {".userContentWrapper._5pcr" , "._2dc"}; 

$.each(obj, function(index,element)){ 
     $("a[data-tooltip-content]").closest(obj).css({"background-color": "violet"}); 
     $("a[data-tooltip-content*='Public']").closest(obj).css({"background-color": "yellow"}); 
     $("a[data-tooltip-content*='Only Me']").closest(obj).css({"background-color": "lime"}); 
     $("a[data-tooltip-content*='friends']").closest(obj).css({"background-color": "cyan"}); 
} 

результат пробы (original image link):

sample result

+2

[ '$ .each'] (http://api.jquery.com/jquery.each/) – empiric

+1

запятые, если вам нужно выбрать на несколько классов. –

+0

удален ~~~~~~~~ – jona

ответ

2

Это должно быть столь же легко, как хранить все имена классов в массиве, а также с помощью цикла

var classses = ['.class1','.class2']; 
for(var i=0;i<classes.length;i++) 
    $("a[data-tooltip-content*='Public']").closest(classes[i]).css({"background-color": "yellow"}); 

Однако, в общем, множественные селекторы могут быть разделены запятыми, так что это также может работать.

$("a[data-tooltip-content*='Public']").closest('.class1, .class2') 
             .css({"background-color": "yellow"}); 
1

Вы почти сделали это сами

$("a[data-tooltip-content*='Public']").closest(".class1, .class2, .class3").css({"background-color": "yellow"}); 
Смежные вопросы