DOMTokenList: replace() メソッド

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

replace()DOMTokenList インターフェイスのメソッドで、既存のトークンを新しいトークンで置き換えます。最初のトークンが存在しない場合、 replace() はすぐに false を返し、トークンリストに新しいトークンを追加しません。

構文

js
replace(oldToken, newToken)

引数

oldToken

置き換えたいトークンを表す文字列です。

newToken

oldToken を置き換えたいトークンを表す文字列です。

返値

論理値で、 oldToken の置き換えに成功した場合は true、それ以外の場合は false です。

以下の例では、 <span> 要素に設定されたクラスのリストを DOMTokenList として受け取るのに Element.classList を使用しています。それからリスト内のトークンを置き換え、リストを <span>Node.textContent に書き込みます。

最初に HTML です。

html
<span class="a b c"></span>

そして JavaScript です。

js
const span = document.querySelector("span");
const classes = span.classList;

const result = classes.replace("c", "z");

span.textContent = result ? classes : "token not replaced successfully";

出力結果は以下のようになります。

仕様書

Specification
DOM
# ref-for-dom-domtokenlist-replace①

ブラウザーの互換性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
replace
return()'s value is a boolean, not void as it used to be.

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support