4
4

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 5 years have passed since last update.

Shift_JISなdocument.writeを非同期で実行する

Last updated at Posted at 2014-07-16

致し方なくdocument.writeを使用しているjsファイル(文字コードはSJIS)を使う必要があったのだけど、
どうにか非同期実行できないかと思って調べてたら目から鱗なやり方が。

document.write()の実行タイミングをずらす方法

ただし、上記の方法だと文字化けしてうまくいかなかったので、
なんか方法はないかなーと思ったら、

ajaxでutf-8じゃないと文字化けする対策 - purazumakoiの[はてなブログ]

どうやらajaxなら文字コードの強制指定ができそうなので、
これらを組み合わせてみたのが以下の関数。

var ajaxDocWrite = function(opt) {

	// document.writeの中身を格納する配列
	var arr = [];

	// document.writeを退避
	var orgDocWrite = document.write;

	$.ajax({
		url : opt.url,
		dataType: 'script',
		beforeSend: function(xhr){

			// 文字化け対策
			if (opt.charset) {
				xhr.overrideMimeType('text/javascript;charset=' + opt.charset);
			}

			// document.writeを配列に格納するだけの関数にする
			document.write = function(str) {
				arr.push(str);
			}
		}
	}).done(function(data){

		// callbackを実行
		opt.done(arr.join(''));

		// document.writeを元に戻す
		document.write = orgDocWrite;

	});

}

実行部分はこんな感じ。

ajaxDocWrite({
	url: 'document_write.js',
	charset: 'Shift_JIS',
	done: function(data) {
		$('#hoge').html(data);
	}
});

今どきこんなことをしなきゃいけない状況もあまりないと思われるけどね…

4
4
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
4
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?