<html>
<body>
<aside>
<div class="menu">
<a href="{% url 'home' %}" class="home">
<img class="home-img" src="{% static 'main/img/home.svg' %}">
<span class="navigation_label">Home</span>
</a><br>
<a href="{% url 'orders' %}" class="orders">
<img class="orders-img" src="{% static 'main/img/orders.svg' %}">
<span class="navigation_label">Orders</span>
</a><br>
<a href="{% url 'account' %}" class="Account">
<span class="navigation_label">Account</span>
</a><br>
</div>
</aside>
<script>
const itemMenu = $('#menu a');
const url = location.pathname;
itemMenu.each(function (el) {
if($(this).attr('href') === url) {
$(this).addClass('current')
}
})
</script>
</body>
</html>
<aside>
<div class="menu">
<a href="{% url 'home' %}" class="home">
<img class="home-img" src="{% static 'main/img/home.svg' %}">
<span class="navigation_label">Home</span>
</a><br>
<a href="{% url 'orders' %}" class="orders">
<img class="orders-img" src="{% static 'main/img/orders.svg' %}">
<span class="navigation_label">Orders</span>
</a><br>
<a href="{% url 'account' %}" class="Account">
<span class="navigation_label">Account</span>
</a><br>
</div>
</aside>
let url = location.href;
if (url.slice(-1) == '/') url = url.slice(0, -1);
$($('#menu a').children().get().reverse()).each(function() {
let link = $(this).children('a').first().attr('href');
if (link.slice(-1) == '/') link = link.slice(0, -1);
if (link && url.indexOf(link) === 0) {
$(this).addClass('current');
self.current = true;
}
});
.current{
background: red;
}
{{ v.varietyName }}добавить к ней класс и в css указать где должны располагаться данные. Но проблема в том, что это повлияет на все полученный данные. т.е. "бананы кокосы" переместятся вместе, а мне необходимо их разделить