Есть веб-страница основного сайта. Для краткости буду называть ее главной.
На этой странице между тегами <div></div>
на php иклудится другая страница совершенно другого сайта оформленного по всем правилам верстки (<html><head></head><body></body></html>
). У каждой из этих страниц свои абсолютно разные таблицы стилей. Как сделать так, чтобы стили с побочной страницы не пересекались со стилями главной страницы?
Например, вот простой стиль главной страницы:
body {color: black}
А вот стиль побочной страницы:
body {color: white}
При это необходимо, чтобы ко всем элементам побочной страницы можно было также применить jQuery с основной страницы, чтобы, например, получить html код элемента h1 побочной страницы:
alert($('#div_v_kotorom_lejit_pobochnaya_stranica > h1').html());
alert($('#div_v_kotorom_lejit_pobochnaya_stranica').find('h1').html());
alert($('h1','#div_v_kotorom_lejit_pobochnaya_stranica').html());
Вообщем, нужно иметь доступ ко всем элементам побочной страницы, также как я имею доступ к элементам главной страницы, поэтому вариант c iframe, как я понимаю, не подходит...
Основная задача: не допустить перемешивание стилей двух разных страниц. Есть идея во всех стилях побочной страницы преписывать перед каждой строкой этот самый айдишник div'а. Т.е. писать:
#div_v_kotorom_lejit_pobochnaya_stranica body {color: white}
Но это слишком муторно. А для автоматической "приписки" и парсинга каждого стиля маловато ресурсов, которые и так стараешься экономить. Поэтому хотелось узнать, может кто сталкивался с подобной или такой же проблемой, и знает решение по-адекватнее?