Изменение содержимого div html из другого html через jquery

Question

Я использую теги iframe в своем index.html. Ниже приведен код

<iframe src="header.html" height="100px" scrolling="no" width="1335px" 
     style="position: absolute; top: 0px;"></iframe> 
    <iframe src="menu.html" height="500px" scrolling="no" width="250px" 
     style="position: absolute; top: 103px;"></iframe> 
    <iframe src="body.html" height="500px" scrolling="no" width="1083px" 
     style="position: absolute; top: 103px; left: 260px"></iframe> 
    <iframe src="footer.html" height="100px" scrolling="no" width="1335px" 
     style="position: absolute; top: 605px;"></iframe> 

Мой Логин ДИВ в menu.html и выхода из системы в footer.html. Я хочу показать logout, когда логин div скрыт (после входа в систему), и когда я нажму «Logout», я хочу, чтобы моя ссылка на выход была скрыта и логин входа был отображен. Поскольку оба они находятся в файле differnet html, поэтому я хочу знать, как мы можем сделать это одновременно. Сейчас эта функция работает, но мне нужно обновить страницу. Также window.location.reload не полезен. Есть ли более простой способ выполнения операций hide/show в нескольких html одновременно.

Answer 1

Если вы действительно должны сохранить это содержание в отдельных файлах и намерены сделать отдельные вызовы для каждого, попробуйте следующее:

<div id="header" style="height: 100px; width 1335px; overflow: hidden; position: absolute; top: 0px;"></div> 
<div id="menu" style="height: 500px; width 250px; overflow: hidden; position: absolute; top: 103px;"></div> 
<div id="body" style="height: 500px; width: 1083; overflow: hidden; position: absolute; top: 103px; left: 260px;"></div> 
<div id="footer" style="height: 100px; weight:1335px; overflow: hidden; position: absolute; top: 605px;"></div> 

И некоторые JQuery так:

<script> 
$(document).ready(function() { 
    $("#header").load("header.html"); 
    $("#menu").load("menu.html"); 
    $("#body").load("body.html"); 
    $("#footer").load("footer.html"); 
}); 
</script> 

Теперь, когда вы иметь всю свою разметку в том же окне, использовать jQuery, чтобы делать с ней все, что вы хотите.