Изменить значение HTML страницы с другой страницы с помощью JavaScript - PullRequest
Новая
       2

Изменить значение HTML страницы с другой страницы с помощью JavaScript

0 голосов
/ 25 августа 2018

Рассмотрим страницу HTML с именем page1.html со следующей простой структурой: 

<html>
<title>Page1</title>
<body>
  <h1>Hello</h1>
</body>
</html>

Можно ли изменить <h1> текст на page1.html с помощью JavaScript из page2.html?

Если это возможно, как этого достичь?

Ответы [ 3 ]

0 голосов
/ 25 августа 2018

Я думаю, что краткий ответ, который вы ищете, - "Нет".

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

Некоторые решения, упомянутые другими друзьями, могут работать, например, использовать локальное хранилище или заполнить cookie-файл - только если они будут работать в одном браузере, - но это определенно потребует некоторых изменений в page1.html, который не принадлежит вам. ищу.

0 голосов
/ 25 августа 2018

Поскольку вы отметили, что вам не нужно, чтобы он был постоянным, вам нужно создать иллюзию, что вы меняете текст <h1> на page1.html с помощью JavaScript из page2.html.

Вам нужно две вещи:

  1. Во-первых, чтобы изменить фактический текст в <h1>, используйте свойство .innerText с методом replace().

  2. Чтобы изменить URL-адрес в адресной строке с /page2.html на /page1.html, используйте методы History API с history.pushState() и history.replaceState().

0 голосов
/ 25 августа 2018

Предполагая, что вы обслуживаете оба ваших HTML S из одного источника (например, если у вас были открыты две вкладки Facebook), вы можете решить эту проблему, используя событие 'storage' (Локальное хранилище совместно используетсявкладки), например:

HTML1: 

<script>
    localStorage.setItem('message', JSON.stringify({ 'myContent': 'i like pizza' }));`
     localStorage.removeItem('message');
</script>

HTML2 

<script>
    $(window).on('storage', e => {
        var message = JSON.parse(e.originalEvent.newValue);
        $('#myH1').text(message.myContent);
    });
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...