Edytowanie elementu z losowym id

0

Witajcie, to mój pierwszy wpis i potrzebuję pomocy.

Chciałbym dodać link do nazwy kategorii wyświetlanego menu (w wersji mobilnej), ponieważ domyślnie jest zrobione to tak, że jest 'Nazwa kategorii' a obok niej "button" do rozwijania listy podkategorii. Chcę, by dodany link w nazwie kategorii przenosił w miejsce tej kategorii na stronie.

Problem jednak w tym, że "li data id" pod którym znajduje się ten element w kodzie jest losowy za każdym razem gdy przeładuje się stronę.

kod wygląda następująco:

   <div class"fixed-elements">
	<div class="swipe-panel open">
		<div class="swipe-panel-content categories left open" style="left: 0px;">
			<div class="mobile-categories">
				<ul>
					<li data id="70285cec635c">
						<a href="#">Dziecko</a>
						<i class="fa fa-bars open-subtree">
						::before

Czyli wspomniana kategoria to "Dziecko", rozwijana lista podkategorii to "fa fa-bars open-subtree". Chcę dodać link w miejsce <a href="#" przenoszący bezpośrednio do kategorii "Dziecko", ale nie wiem jak to zrobić, przez to że element powyżej (li data id="70285cec635c") jest losowy. Dodam, że nie mam bezpośredniego dostępu do źródła strony, ale mogę je edytować lub coś dodawać poprzez specjalne pole edycji JavaScript/HTML/CSS w panelu administracyjnym - chodzi konkretnie o sklep Internetowy.

Jeszcze raczkuję w tych tematach, więc będę wdzięczny za "łopatologiczne" odpowiedzi. :)

1

Najlepiej jakbyś mógł dodać id do jakiegoś elementu, wtedy łatwiej byłoby go złapać. Istnieje jeszcze opcja, że któraś z klas w rodzicach jest unikatowa (używana tylko raz). Na ten moment możesz w tevtoolsach kliknąć na ten a prawym przyciskiem myszy -> kopiuj -> Skopiuj ścieżkę JS i zakładając, że struktura strony nie zmienia się dynamicznie to będziesz miał złapany ten link. Ewentualnie jeśli masz dostęp do procesu nadawania data-id to możesz gdzieś je zapisać i odnosić się do niego w querySelector.

2

Spróbuj

const li = document.querySelector("div.fixed-elements div.swipe-panel div.swipe-panel-content div.mobile-categories ul li");
0
Gouda105 napisał(a):

Najlepiej jakbyś mógł dodać id do jakiegoś elementu, wtedy łatwiej byłoby go złapać. Istnieje jeszcze opcja, że któraś z klas w rodzicach jest unikatowa (używana tylko raz). Na ten moment możesz w tevtoolsach kliknąć na ten a prawym przyciskiem myszy -> kopiuj -> Skopiuj ścieżkę JS i zakładając, że struktura strony nie zmienia się dynamicznie to będziesz miał złapany ten link. Ewentualnie jeśli masz dostęp do procesu nadawania data-id to możesz gdzieś je zapisać i odnosić się do niego w querySelector.

po zrobieniu tego co piszesz otrzymałem taki link:
document.querySelector("body > div.fixed-elements > div.swipe-panel.open > div.swipe-panel-content.categories.left.open > div > ul > li:nth-child(2) > a")

Riddle napisał(a):

Spróbuj

const li = document.querySelector("div.fixed-elements div.swipe-panel div.swipe-panel-content div.mobile-categories ul li");

Czy mogę prosić o bardziej "łopatologiczne" wyjaśnienie jak mogę użyć Waszych propozycji? Mój poziom jest naprawdę, bardzo niski, dopiero wszystkiego się uczę. Przypuśćmy, że w miejsce tego "#" chciałbym wkleić link do domeny np. "https://abc123.pl/". Jak skonstruować ten skrypt uwzględniając to co napisaliście?

0

@gbsn: do tego, co otrzymałeś dodaj .href = "https://abc123.pl/"

0
Gouda105 napisał(a):

@gbsn: do tego, co otrzymałeś dodaj .href = "https://abc123.pl/"

@Gouda105: Czy masz na myśli:

document.querySelector("body > div.fixed-elements > div.swipe-panel.open > div.swipe-panel-content.categories.left.open > div > ul > li:nth-child(2) > a.href = "https://abc123.pl/")

?

1

@gbsn: nie. Zrób tak

document.querySelector("body > div.fixed-elements > div.swipe-panel.open > div.swipe-panel-content.categories.left.open > div > ul > li:nth-child(2) > a").href = "https://abc123.pl/"

1 użytkowników online, w tym zalogowanych: 0, gości: 1