Фриланс-проекты

Фриланс-проекты

Доделать код на jquery для определения цепочки родительских элементов

Javascript и Typescript — неверно указаны категории?

Есть код на jquery, который при наведении мышки на элементы (в основном ссылки) должен определять их параметры и параметры их родительских элементов. В коде не все работает, нужно взять его за основу и срочно довести до рабочего состояния. В нем не все функции, и он выделяет сразу все (а это неправильно) родительские div вплоть до контейнера всей страницы:

$(document).ready(function() {

$('div').bind({

mouseenter: function() {

$(this).children('div:first-child').css('border','1px solid #ff0');

$(this).children('div:first-child').find('a').css('border','1px solid #60ff00');

var stat_parent_class[1] = $(this).children('div:first-child').attr('class');

var stat_selected_href = $(this).children('div:first-child').find('a').attr('href');

$('stat').text(stat_parent_class[1] + '<br>' + stat_selected_href);

mouseleave: function() {

$(this).children('div:first-child').css('border','1px solid #fff');

$(this).children('div:first-child').find('a').css('border','1px solid #fff');

}

});

</script>

Что должен делать код:

1. Водим мышкой по элементам страницы. Каждый элемент при наведении подсвечивается рамкой #60ff00

2. Код должен определить цепочку его ближайших родительских элементов (до 5 уровней). Т.е. если например html выглядит так:

<a class='a1' href='site.com'>ссылка, на которую навели мышку</a>

</span>

</div>

То наш код должен найти эту цепочку:

div class='d4' => div class='d3' => div class='d2' => div class='d1' => span class='s1' => a class='a1'

3. Каждый родительский элемент в этой цепочке подсвечивается рамкой своего цвета (зеленый, синий, фиолетовый, красный, оранжевый).

4. Параметры каждого элемента цепочки нужно записать в переменные. Для родительских элементов - это название тэга и его css-класс, а для элемента под мышкой - название тэга, его css-класс, его текст и значение href, если это ссылка. Если какое-либо значение получается пустым или не определено, то записать в переменную нужно не undefined, а "пусто".

5. Переменные называются вот так:

stat_parent_name[1..5] - название тэга

stat_parent_class[1..5] - его css-класс

stat_selected_name - название элемента под мышкой

stat_selected_class - его css-класс

stat_selected_text - его текст

stat_selected_href - его href

Для приведенного выше примера получатся такие значения:

stat_selected_name = "a"

stat_selected_class = "a1"

stat_selected_text = "ссылка, на которую навели мышку"

stat_selected_href = "site.com"

stat_parent_name[1] = "span"

stat_parent_class[1] = "s1"

stat_parent_name[2] = "div"

stat_parent_class[2] = "d1"

stat_parent_name[3] = "div"

stat_parent_class[3] = "d2"

stat_parent_name[4] = "div"

stat_parent_class[4] = "d3"

stat_parent_name[5] = "div"

stat_parent_class[5] = "d4"

Сделать нужно сегодня.

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

Ставки 2

Андрей Трубай

4 0

Проекты 4
Оценка -
Рейтинг 257

Бюджет: 300 UAH Срок: 1 день

Сделаю быстро и качественно.

Вячеслав Иванов
Винница, Украина

Проектов 9
Оценка -
Рейтинг 848

Доделать код на jquery для определения цепочки родительских элементов

Андрей Трубай

Ставки скрыты

Ставки пока отсутствуют

Актуальные фриланс-проекты в категории Javascript и Typescript

Разработка собственной SaaS-системы для автоматизации кофеен - аналог Poster POS

Платформа стейкинга на блокчейне

Next.js-разработчик для доработки существующего сайта

Разработка формы онлайн-записи и БД

Google exel добавить логику JS в Apps Script