ある要素の内容を別のhtmlファイル内の別の要素の内容で置き換えたいと思います。異なるHTMLファイルのある要素から別の要素にhtmlを置き換えます。
私はなどdocument.getElementById
と$(this)
を使用して、同じHTMLファイル内の要素にこれを行うには、多くのJS & JQ機能を見てきましたが、これは別のHTMLファイル内の別の要素に一つの要素の内容を置き換えることができますか?以下は私の問題の例です。
pageOne.htmlファイル
<!DOCTYPE html>
<html>
<head>
<title>Page 1</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("#first").click(function() {
$("#second").html($(this).html());
});
});
</script>
<body>
<p id = "first">Hello</p>
<a href="pageTwo.html" target="_self">Page 2</a>
</body>
</html>
pageTwo.html
<!DOCTYPE html>
<html>
<head>
<title>Page 2</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<body>
<p id = "second">World!</p>
<a href="pageOne.html" target="_self">Page 1</a>
</body>
</html>
私は、次のようにこれを行うためのさまざまな方法を試してみましたが、私はちょうどそれを取得していない午前:
<html>
<head>
<script>
function myFunction() {
document.getElementById("#second").innerHTML = #first;
}
</script>
</head>
<body>
<p id = "first" onclick = "myFunction()">Hello</p>
</body>
</html>
これは可能ですか?#番目の要素をクリックすると、#2番目の要素の内容が#firstに置き換えられます別のhtmlファイルにある要素の内容ですか?したがって、ページ間をクリックすると、<p>
の内容は同じになります。
が同じHTMLページにロードされた二つのファイルです:あなたは、あなたのウェブサーバ上のこれらの2つのファイルが必要になりますiframeで?それらは別々の窓にありますか? – Mario
ajaxとSocketIOライブラリが必要です。 – Lukabot
両方のページを同時に表示しない限り(@Marioの質問によると、iframe /別のタブにありますか?)、クライアントサイドのJavaScriptではこれを行うことはできません。 – CBroe