jquery как разбирать класс или атрибуты объекта

Извините, если это вопрос «noob». (Я сильно отредактировали быть яснее, как к тому, что я искал.) Рассмотрим некоторые ссылки:jquery как разбирать класс или атрибуты объекта

<p><a class="bgColor_0" href="whatever">Click Me</a></p> 
<p><a class="bgColor_1" href="whatever">Click Me</a></p> 
<p><a class="bgColor_2" href="whatever">Click Me</a></p>

Где-то еще на странице есть DIV, который также использует то же имя класса. Таким образом, в таблице стилей:

div.bgColor_1 {background-color: #ffffff; } 
div.bgColor_2 {background-color: #00ffff; } 
div.bgColor_3 {background-color: #ffff00; }

То, что я хочу, чтобы получить значение фонового цвета свойства класса нажатых в виде строки (или нуль, если не установлено).

Так что я хочу, чтобы создать функцию щелчка, который проверяет для класса, начиная с bgColor_

jQuery('a').click(function(){ 
    myClass = jQuery(this).attr('class').match(/\bbgColor_\S+/g); 
    // eg. myClass = 'bgColor_0'; 
    // now... how do I get the background-color property of bgColor_0?; 

});

То, что я хочу, чтобы добраться до является -value- собственности BackgroundColor в DIV с классом MyClass

например. Если пользователь щелкнул a.bgColor_1, я хочу получить свойство background-color класса div.bgColor_1 в таблице стилей, а затем назначить другой (для определения) div классу bgColor_1, чтобы я мог изменить его цвет.

источник

2014-02-07 jchwebdev

По какой-либо причине вы не можете иметь как 'bg_Color_X', так и' hasBgColor'? Таким образом, вам не нужно делать какие-либо частичные селектора матчей. –

Кстати, имя класса bgColor_0 не очень семантично. Попробуйте заглянуть в http: // sass-lang.com/поэтому вам не нужно злоупотреблять именами классов, чтобы избежать повторения одного и того же цвета в нескольких местах. –

@ErikPhilips. Нет никаких оснований, это гораздо более чистое решение в моих книгах. Он связывает три элемента вместе семантически вместо того, чтобы полагаться на подстроки на элементы группы. –

Попробуйте это:

$(this).attr('class').substring(0,7)="bgcolor"

И для получения атрибутов класса, Я хочу показать вам, это:

Look Here

источник

2014-02-07 20:32:35

Это наиболее близко к ответу. Но что, если для этого элемента есть более одного класса? – George

Вы можете использовать: $ (this) .hasClass ('bgcolor') –

Я был неправ и сделал это «правильным» ответом для моих нужд ... не для исходного комментария, а для ссылки «Look Here», которая оказывается тем, что мне нужно. По-видимому, вам нужно пройти таблицы стилей, чтобы получить свойства селектора, который в настоящее время не активен ... Я этого не понимал. Таким образом, функция в этой ссылке выполняет работу. Кроме того, накладные расходы на удивление низки. Благодаря! – jchwebdev

Вы ищете селектор частичного соответствия:

$(this).is("[class^='bgColor']")

Это короткий и сладкий, он требует, чтобы класс начинается с bbgColor как ваши примеры.

Если вам нужно разрешить для класса появляться в любом месте атрибута, использование:

$(this).is("[class*='bgColor']")

источник

2014-02-07 20:30:33 helion3

typo в селекторе –

Typo? Я ничего не вижу. Он отлично работает: http://codepen.io/helion3/pen/jkDLg – helion3

Извините, я читал его разметку HTML, и я увидел 'bgColor_', поэтому мне интересно, почему есть два' b' в обоих y 'alls selectors –

Я думаю, что люди, отвечая неправильный вопрос. Я думаю, что ваш вопрос был

«Как получить свойство background-color для bgColor_0?» но это должно быть «Как получить свойство background-color ссылок, которые имеют класс css, начинающийся с bgColor?»

http://jsfiddle.net/mendesjuan/j4q56/

jQuery('a').click(function(){ 
    var $link = jQuery(this); 
    var isMatch = $link.attr('class').match(/\bbgColor_\S+/g); 
    if (isMatch) { 
     console.log($link.css('background-color')); 
    }  
});

См https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match и http://api.jquery.com/css/

Обратите внимание, что эта модель bgColor_0bgColor_1 кажется как анти шаблон и является код запах.

источник

2014-02-07 20:55:39

Вы правы. Все сосредоточились на его регулярном выражении - очевидно, я был недостаточно ясен. В основном я использую класс ссылки для изменения класса на другой элемент страницы. (Когда вы нажимаете на ссылку, она меняет bgcolor div, добавляя класс.) У меня, должно быть, был старший момент. Все, что мне нужно было сделать, это захватить класс, а затем использовать $ link.css ('background-color') DUUUUUH. Спасибо, что помог мне вырваться из моей дымки. – jchwebdev

Вы имеете в виду вот это?

jQuery('a').click(function(){ 
    alert($(this).css('background-color')); 
});

источник

2014-02-07 21:07:05 ochi

jquery как разбирать класс или атрибуты объекта

ответ

Смежные вопросы