Skrypt, który wstawi kilka linków na stronę.

Odpowiedz Nowy wątek
2019-03-05 00:24
0

Witam i proszę o pomoc.
Potrzebuję zrobić skrypt, który będzie wstawiał odnośniki do kilku stron na obecną stronę WWW. Po kliknięciu na link strona musi otwierać się w tym samym oknie. Zależy mi na tym aby odnośniki do stron i nazwy odnośników były podane w samym skrypcie, a cały skrypy mógłbym zapisać w pliku zewnętrznym np., odnosniki.js. Potem w razie zmiany linków, zmieniałbym dane w skrypcie a nie w html.
Udało mi się zrobić coś zbliżonego do celu i wygląda to tak:


<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2">

<SCRIPT language="JavaScript">
function openwindow1()
{
window.open("https://www.strona1.pl", '_self');
}
function openwindow2()
{
window.open("https://www.strona2.pl", '_self');
}
function openwindow3()
{
window.open("https://www.strona3.pl", '_self');
}
function openwindow4()
{
window.open("https://www.strona4.pl", '_self');
}
function openwindow5()
{
window.open("https://www.strona5.pl", '_self');
}
</SCRIPT>

</head>

<body>

<a href="javascript:openwindow1()">Link do strony1</a><br>
<a href="javascript:openwindow2()">Link do strony2</a><br>
<a href="javascript:openwindow3()">Link do strony3</a><br>
<a href="javascript:openwindow4()">Link do strony4</a><br>
<a href="javascript:openwindow5()">Link do strony5</a><br>

</body>

</html>
edytowany 4x, ostatnio: SajmonC64, 2019-03-05 00:32

Pozostało 580 znaków

2019-03-05 00:36
1

a cały skrypy mógłbym zapisać w pliku zewnętrznym np., odnosniki.js. Potem w razie zmiany linków, zmieniałbym dane w skrypcie a nie w html.

https://www.w3schools.com/tags/att_script_src.asp

ps: nie musisz tworzyć nowej funkcji dla każdego linka. jak już tak bardzo chcesz mieć te funkcję, to zrób jedną, która przyjmuje linka jako parametr.

https://developer.mozilla.org[...]/Web/JavaScript/Guide/Funkcje

https://www.w3schools.com/js/js_function_parameters.asp

edytowany 4x, ostatnio: WeiXiao, 2019-03-05 00:40

Pozostało 580 znaków

2019-03-05 00:47
0

Wiem, że trzeba wskazać plik js, jeśli jest to plik zewnętrzny.
Nie umiem programować w JavaScript. Siedziałem nad tym kilka dni i tylko to udało mi się sklecić. Obawiam się, że sam nie dam rady stworzyć złożonej funkcji. Bardzo proszę o pomoc.

Pozostało 580 znaków

2019-03-05 09:37

Nie jest to może najpiękniej napisane, ale starałem się to zrobić w sposób maksymalnie prosty, żebyś rozumiał jak to działa. Wiem, że kilka rzeczy powinno się zrobić inaczej, np. skorzystać z addEventListener zamiast onload="wstawLinki()", ale po poziomie Twojego pytania i tego, co napisałeś widać, że jesteś totalnie początkujący, więc nie ma co na start przywalać Cię jakąś kosmiczną ilością wiadomości ;)

Poniżej masz dwa pliki - HTML oraz JS. Po prost skopiuj treść ramek i wklej do tych plików u siebie na kompie. Są tylko dwie rzeczy, o których musisz pamiętać:
1) oba pliki muszą być w tym samym folderze
oraz
2) plik ze skryptem musi się nazywać skrypt.js. Plik HTML może się nazywać dowolnie, nie ma to tutaj znaczenia.

<html>
<head>
  <meta http-equiv="Content-type" content="text/html; charset=iso-8859-2">
  <script language="JavaScript" src="skrypt.js"></script>
</head>
<body onload="wstawLinki()">
  <div id="tutaj_daj_linki">
  </div>
</body>
</html>
const noweStrony= [
  ["http://www.wp.pl", "Wirtualna Polska"],
  ["http://onet.pl", "ONECIK jest cool"],
  ["http://4programmers.net", "jakas przypadkowa strona dla nerdow"],
  ["http://www.sex.com", "cos do obejrzenia po godzinach"],
  ["http://drakonica.pl", "Przemyslenia wielkiego zielonego smoka/smoczycy"],
];

function dopiszLink(link, opis) {
  var nowyLink= document.createElement("a");
  var nazwaLinku= document.createTextNode(opis);
  nowyLink.appendChild(nazwaLinku);
  nowyLink.title= opis;
  nowyLink.href= "javascript:otworzNoweOkno('"+link+"')";
  document.getElementById("tutaj_daj_linki").appendChild(nowyLink);
  var nowyOdstep= document.createElement("br");
  document.getElementById("tutaj_daj_linki").appendChild(nowyOdstep);
}

function wstawLinki() {
  for (ster= 0; ster < noweStrony.length; ster++) {
    dopiszLink(noweStrony[ster][0], noweStrony[ster][1]);
  }; 
}

function otworzNoweOkno(adresOkna){
  window.open(adresOkna, '_self');
}

Daj proszę znać, czy rozumiesz, jak to działa. Jeśli czegoś nie czaisz to chętnie wyjaśnię (ale z drugiej strony nie chciało mi się pisać referatu na dwa ekrany, żeby potem nikt tego nie przeczytał ;)


That game of life is hard to play
I'm gonna lose it anyway
The losing card I'll someday lay
So this is all I have to say
edytowany 7x, ostatnio: cerrato, wczoraj, 22:57
target _self jest domyślnym zachowaniem kotwic. Mieszanie html css i js jest złą praktyką - pablop76 2019-03-05 10:10
Słuszna uwaga, aczkolwiek wziąłem to po prostu przeniosłem z tego, co OP wrzucił w pierwszym poście. Ale fakt, mogłem poprawić. Tylko jak napisałem na początku wpisu - kilka rzeczy można poprawić, ale nie chciałem robić rewolucji, żeby osoba początkująca w ogóle załapała co i jak tam się dzieje. - cerrato 2019-03-05 11:31
Czy umieszczenie linków do strony drakonicy w sąsiedztwie tej drugiej strony to przypadek?;) - karpov 2019-03-05 13:31
nie wiem o co Ci chodzi z tą "drugą stroną". Na 4p naprawdę wiele osób zagląda i wcale nie jest to taka totalna patologia ;) - cerrato 2019-03-05 13:35
@karpov: dałbyś lepiej łapkę :P - cerrato 2019-03-05 13:35

Pozostało 580 znaków

2019-03-05 09:57
1

Stwórz tablicę obiektów, w której każdy obiekt będzie posiadał dwie właściwości, link i nazwę.
np:

const link = [
    {link:"link1",name:"pierwszy link"},
    {link:"link2",name:"kolejny link"},
    {link:"link2",name:"kolejny link2"},
    {link:"link3",name:"ostatni link"}
];

potem za pomocą pętli przeleć po każdym obiekcie i stwórz z niego link i dodaj do dokumentu

edytowany 2x, ostatnio: pablop76, 2019-03-05 09:58
A w sumie to czym się to rozwiązanie różni od mojego postu piętro wyżej? :P - cerrato 2019-03-05 11:30
Jak zacząłem pisać odpowiedź Twojej jeszcze nie było. Trochę mi się zeszło. - pablop76 2019-03-05 11:33
OK, to wiele wyjaśnia :) - cerrato 2019-03-05 11:33

Pozostało 580 znaków

2019-03-11 01:48
0

Witajcie.
Dziękuję za odpowiedzi. Moje wyrazy uznania dla Ciebie cerrato za poświęcenie i szczegółowe wskazówki. Twoje rozwiązanie działa, a ja nie spotkałem takiego nigdzie indziej. Podejrzewam, że wiele osób skorzysta z Twojego pomysłu. Jedynym małym mankamentem jest to, że nie są wyświetlane wszystkie polskie znaki – ą,ś,ź.
screenshot-20190311015118.png
Przypuszczam, że można to w jakiś sposób dodać do skryptu, aby te znaki były prawidłowo wyświetlane. Jeszcze raz bardzo dziękuję za pomoc. Pozdrawiam.

edytowany 1x, ostatnio: SajmonC64, 2019-03-11 01:51

Pozostało 580 znaków

wczoraj, 09:06
0

Podejrzewam, że to kwestia kodowania.
Po pierwsze - ustal na poziomie HTML, wpisz w <HEAD> coś w stylu <meta charset="utf-8">.
A po drugie - upewnij się, że edytor, w którym piszesz sobie radzi z obsługą odpowiedniego kodowania (dlatego np. nie używaj Windowsowego notatnika, ale czegoś lepszego). I w tym edytorze ustaw także stosowne kodowanie - pasujące do tego, które masz zadeklarowane w HTML.

Jeśli nie będzie działać to wrzuć tutaj cały skrypt oraz HTML, pokombinujemy :)
Pamiętaj też, że uwaga odnośnie ustawienia kodowania w edytorze dotyczy zarówno pliku HTML, jak i wczytywanego przez niego pliku JS.


That game of life is hard to play
I'm gonna lose it anyway
The losing card I'll someday lay
So this is all I have to say

Pozostało 580 znaków

Odpowiedz
Liczba odpowiedzi na stronę

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