Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

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

More than 5 years have passed since last update.

致し方なく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);
    }
});

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

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away