1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Bookmarklet で String.replace() ができない・効かない【Edge】

Posted at

はじめに

 タイトルは「できない」としましたが、けっして Edge に何か不具合や落ち度があったわけではありません。この記事では「できない事態が起きたときに、コードの何を疑うべきか。どう対処したか」について記します。

 Edge で発生しました。他のブラウザではまだ確認していません。

発生した事象

 Bookmarklet を作成していて、その中に以下のような処理がありました。

var a = b.replace(' ', '%20');

 お察しの通り、URL エンコードした文字列をいろいろと操作する処理の一部です。

 これが Edge の Bookmarklet にしたとたん、何も replace されないということがおきました。

 しばらくハマったのですが、原因は、作成した Bookmarklet のコードをブックマークに登録した瞬間、以下のようなコードに書き換えられてしまったことです。

var a = b.replace(' ', ' ');

 こりゃ replace されませんわ。

 どうも Edge はブックマークを登録する瞬間に、文字列リテラルの中の %20 を空白に置き換えちゃうみたいですね。

回避方法

 以下のようにして回避しました。

var a = b.replace(' ', '%' + '20');

第一引数もあやしい

 作成したコードをブックマークレットに変換するために、以下のサイトを利用していました。

Website Tools:ブックマークレット変換(成形)

 こっちにもトラップがあって(いや自分が迂闊だっただけで、上記サイト様には落ち度はありませんが)、「空白を%20に変換」というチェックボックスを気づかずに作業していました。そしたら、しばらく以下のように変換されていました。

var a = b.replace('%20', '%' + '20');

 こりゃ replace されませんわ。

さらに回避方法

 チェックボックスには気づきましたが、もう念のため、以下のように変更しました。

const spc = String.fromCharCode(0x0020);
var a = b.replace(spc, '%' + '20');

おわりに

 コンソールでうまく動くのに、ブックマークレットにした途端ちがう動きをして、さらに躓くポイントが二箇所もあったためにハマってしまいました。

 上記対処で無事ブックマークレットは作成できました。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?