Блог

У меня есть веб-сайт, который позволяет пользователю сохранять текстовое содержимое, а затем отображать его как есть. Пользователь может использовать теги HTML для создания своих данных так, как он хочет — дизайн, шрифты, разделы, таблицы и так далее…

Чтобы отобразить сохраненные данные, я направляю пользователя на страницу с собственным верхним / нижним колонтитулом, а его данные посередине. Проблема возникает, когда у пользователя есть несколько недопустимых HTML-тегов или незакрытых, тогда это мешает моему собственному HTML-заголовку / нижнему колонтитулу, и вся страница запутывается.

Есть ли способ инкапсулировать данные пользователя, чтобы это не повредило странице?

Вы можете попробовать загрузить его iframe . Не тестировал, но я думаю, что это должно сработать.

вы можете использовать iframe с фиксированной шириной и высотой.

Предложение Iframe хорошее, но его было недостаточно. Поскольку я хотел, чтобы он отображался так, как будто он был частью страницы, и я не знал, какова длина и размер пользовательских данных, решение, которое я использовал, такое:

Создана страница, на которой отображаются только пользовательские данные. Открыл его в iframe, который был расположен между верхним и нижним колонтитулами моей главной страницы. Теперь для хитрости — когда у пользователя много данных, чтобы избежать полос прокрутки в середине страницы, я использовал этот скрипт для события загрузки iframe:

   function setHeight()
  {
  //get page height
  var the_height=
  document.getElementById('userFrame').contentWindow.document.body.scrollHeight;

  //set iframe height
  document.getElementById('userFrame').height=the_height;
  }
  

Таким образом, при загрузке страницы высота iframe будет меняться в соответствии с ее размером, сдвигая нижний колонтитул вниз.
После этого просто нужно было установить границу iframe на «none», и страница выглядит нормально.