Добавить класс в <i>, если <span> содержит текст
Попытка добавить класс «галочка» к i с идентификатором «партнер»
$(document).ready(function () {
jQuery('span:contains("true")').addClass('checkmark');
});
Этот код работает нормально, но добавляет класс прямо туда, где он проверяет. Как я могу добавить этот класс к совершенно другому элементу i?
Возможный дубликат JQuery: проверка, содержит ли div текст, затем действие
@Roomy Спасибо за ссылку. Решил это, используя некоторый код оттуда.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 4
Используйте родительский селектор jQuery:
$(document).ready(function () {
jQuery('span:contains("true")').parent().addClass('checkmark');
});
Или, что еще безопаснее, вы можете использовать .closest:
$(document).ready(function () {
jQuery('span:contains("true")').closest('i.someClass').addClass('checkmark');
});
У меня несколько элементов i, это ограничит меня ближайшим? i, к которому я бы хотел добавить, прошёл мимо нескольких других i. Любой способ добавить его к i, у которого уже есть определенный класс / идентификатор?
.closest принимает селектор и затем перемещается по дереву DOM вверх, пока не найдет соответствующий элемент: api.jquery.com/closest Так что да, вы можете добавить к нему определенный класс или идентификатор. Я отредактировал его, чтобы вы могли видеть, куда нужно добавить класс.
Сложно понять ваш вопрос, но если я правильно понял
"add class checkmark to i that has id partnered. How can I append this class to a completely different i element?"
тогда это довольно просто
$(document).ready(function () {
$('i[id^ = "<desired id name>"]').addClass('checkmark');
});
Примечание: кажется довольно непрактичным иметь это в качестве идентификатора вместо класса с точки зрения html / css.
Извините, английский не мой родной язык. Я получаю либо истину / ложь в span. Я хотел бы проверить, включает ли этот span текст «true», и если да, добавить класс к другому элементу i. Надеюсь, это имеет смысл.
Вот ваш ответ на простом JavaScript:
// Get the element with ID 'partnered'
// Get a <span> element (create one if there's none)
var partnered = Document.prototype.getElementById.call(document, 'partnered'),
span = (
Document.prototype.querySelector.call(document, 'span') ||
Document.prototype.createElement.call(document, 'span')
);
// Custom function
function addClass() {
var args = [... arguments].slice(1),
$args = args.length,
element = arguments[0];
// Loop through arguments to update them
for (var i = 0; i < $args; i += 1)
args[i] = String(args[i]);
// Loop through arguments after updating all of them
for (var i = 0; i < $args; i += 1) {
// Cache the index
var className = args[i];
// Append new class name
element.setAttribute(
'class',
// Get the current class
((element.getAttribute('class') || '')
// Remove existing duplicates of the class to add
.replace(RegExp('\\b' + className + '\\b', '')
// Keep the class attribute tidy
// and add the class
.trim() + ' ' + className).trim()
)
}
}
/* Synchronously
A while loop could work too if you're certain enough.
*/
if (span.textContent || span.innerText)
addClass(partnered, 'checkmarked');
/* Asynchronously */
(function check() {
if (span.textContent || span.innerText)
addClass(partnered, 'checkmarked');
else
typeof requestAnimationFrame == 'function' ?
requestAnimationFrame(check) :
setTimeout(check)
})
Решено с помощью
if ($('span#ispartner:contains("true")').length > 0) {
$("#partnered").addClass("checkmark");
}
Спасибо за помощь!
Что ж, вы можете, но мы понятия не имеем, так как вы не предоставили html.