---
title: History.replaceState()
slug: Web/API/History/replaceState
translation_of: Web/API/History/replaceState
---
<div>{{APIRef("History API")}}</div>

<p>Метод <strong><code>History.replaceState()</code> </strong>изменяет текущую запись в истории, заменяя её на значения <code>stateObj</code>, <code>title</code> и <code>URL</code>, передаваемые в параметрах метода. Данный метод особенно полезен, когда вы хотите обновить объект состояния или URL текущей записи в истории в ответ на какое-то действие пользователя.</p>

<h2 id="Синтаксис">Синтаксис</h2>

<pre class="syntaxbox notranslate">history.replaceState(<em>stateObj</em>, <em>title</em>, [<em>url</em>])</pre>

<h3 id="Параметры">Параметры</h3>

<dl>
 <dt><code>stateObj</code></dt>
 <dd>Объект состояния – это JavaScript-объект, связанный с записью в истории, переданной в метод <code>replaceState()</code>. Объект состояния может быть <code>null</code>.</dd>
 <dt><code>title</code></dt>
 <dd>Заголовок - <a href="https://github.com/whatwg/html/issues/2174" rel="noopener">все браузеры, кроме Safari, на данный момент игнорируют этот параметр</a>, но могут начать использовать в будущем. Ввиду будущих изменений метода, безопасным решением является передача пустой строки. В качестве альтернативы вы можете передать короткий заголовок для состоянии, в которое переходите.</dd>
 <dt><code>url</code> {{optional_inline}}</dt>
 <dd>URL-адрес записи в истории. Новый URL должен вести на тот же домен, протокол и порт, иначе pushState() выдаст исключение.</dd>
</dl>

<h2 id="Примеры">Примеры</h2>

<p>Предположим, на странице <code>http://mozilla.org/foo.html</code> выполняется следующий JavaScript-код:</p>

<pre class="notranslate">let stateObj = { foo: "bar" }
history.pushState(stateObj, "page 2", "bar.html")
</pre>

<p>Объяснение этих двух строк можно найти в приведённом выше разделе <em><a href="#Example_of_pushState_method">пример метода pushState()</a></em>.</p>

<p>Далее, предположим, на странице <code>http://mozilla.org/bar.html</code> выполняется JavaScript-код:</p>

<pre class="notranslate">history.replaceState(stateObj, "page 3", "bar2.html")
</pre>

<p>Это приведёт к тому, что в URL-строке отобразится адрес <code>http://mozilla.org/bar2.html</code>, но браузер не станет сразу загружать <code>bar2.html</code> и даже не станет проверять наличие этой страницы <code>bar2.html</code>.</p>

<p>Теперь предположим, что пользователь переходит по адресу <code>http://www.microsoft.com</code>, а затем нажимает на кнопку <strong>"Назад"</strong>. В этом случае в URL-строке отобразится <code>http://mozilla.org/bar2.html</code>. Если же пользователь снова нажмёт на кнопку <strong>"Назад"</strong>, в URL-строке отобразится <code>http://mozilla.org/foo.html</code> и полностью обойдёт <code>bar.html</code>.</p>

<h2 id="Спецификации">Спецификации</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName("HTML WHATWG", "history.html#dom-history-replacestate", "History.replaceState()")}}</td>
   <td>{{Spec2("HTML WHATWG")}}</td>
   <td>No change from {{SpecName("HTML5 W3C")}}.</td>
  </tr>
  <tr>
   <td>{{SpecName("HTML5 W3C", "history.html#dom-history-replacestate", "History.replaceState()")}}</td>
   <td>{{Spec2("HTML5 W3C")}}</td>
   <td>Initial definition.</td>
  </tr>
 </tbody>
</table>

<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2>



<p>{{Compat("api.History.replaceState")}}</p>