Mam plik index.html, a w nim [p]#AB0404[/p]. Chciałbym, aby w index2.html był div "div1", który ma kolor podany w p w index.html.
Próbowałem napisać coś sam, ale nie potrafię przetransportować wartości do innego pliku. Da się to jakoś zrobić? Najlepiej vanilla js lub/i jquery.
index.html
<!DOCTYPE html>
<html>
<head></head>
<body>
<p id="AB0404" style="color:red;">abc</p>
</body>
</html>
index2.html
<!DOCTYPE html>
<html>
<head></head>
<body>
<iframe src="http://[adres pliku]/index.html" id="myFrame">Jestem ramką!</iframe>
<button onclick="funkcja();">kliknij</button>
<script>
function funkcja() {
var iframe = document.getElementById("myFrame");
var e = iframe.contentWindow.document.getElementById("AB0404");
alert(e.style.color);
}
</script>
</body>
</html>
Musisz mieć identyczne:
- protokół ramki głównej i iramki http://, https//, file:///
- domenę
Różne przeglądarki różnie podchodzą do pracy na file:///, więc tu może w ogóle nie działać.
Ale co Ty próbujesz zrobić? Bo jeśli jakaś wartość ma być widoczna na różnych stronach to najrozsądniej by było ją zapisać do localStorage
i czytać z obu. To zakładając, że ma być dynamicznie, bo jak statycznie i z jakiegoś powodu nie ma mowy o server-side to możesz sobie umieścić tę wartość nawet w pliku js.
@Freja Draco: Właśnie sprawdziłem. Może coś źle zrobiłem, ale nie działa. Chcę to zrobić lokalnie, bez uploadu na serwer
Możesz użyć serwera lokalnego.
Jak chcesz bez używania serwera, to musisz podać:
file:///ŚCIEŻKA-DO-PLIKU/index.html
ale nie wiem, czy w każdej przeglądarce tak zadziała.
Przy okazji odkryłam, że jest na to nowsza metoda z wykorzystaniem:
<link rel="import" ...>
https://www.html5rocks.com/en/tutorials/webcomponents/imports/
ale nie działa
Ale nie działa, bo komunikat błędu brzmi?