0

wordpress ブログに 2 つの異なるスタイルシートを用意しようとしています。これにより、Web 経由でページにアクセスするときに 1 つのスタイルシートが使用され、iOS アプリ経由でブログ コンテンツにアクセスするときにもう 1 つのスタイルシートが使用されます。現在、iOS アプリからの URL リクエストに ?app=true を追加しています。これは、ブログでこの文字列を検索して、別のスタイルシートをロードできるようにするためです。JSON API プラグインを使用して、iOS アプリがプログラムでブログ投稿を取得し、iOS アプリの Web ビューに表示できるようにします。

私の wordpress ブログでは、URL で ?app=true を検索する JavaScript を使用しています。そうであれば、別のスタイルシートをロードします。 

<script language="javascript" type="text/javascript">
    var location = window.location.href;
if(location.indexOf("?app=true") > -1) {        
document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"appstyle.css\" />");
}
</script>

このコードは、wordpress テーマの header.php ファイルのタグ内に配置されています。

私が使用しようとしているスタイルシートは appstyle.css と呼ばれ、header.php と同じディレクトリにあります。

私が抱えている問題は、このコードを使用すると、ブラウザーのページが無限にリロードされることです。問題は document.write 関数にあるようです.それがなければ、Webページは正常にロードされます(ただし、明らかに appstyle.css スタイルシートをロードしていません)。

私もこのifステートメントを試しました：

if(window.location.search.indexOf('?app=true') === 0)

しかし、違いはないようです。

iOS アプリと Web でロードされているかどうかに応じて、異なるスタイルシートをロードするより良い方法はありますか? 私のコードで間違っていることはありますか?

4

3 に答える 3

4

この行には構文エラーがあります:

document.write("<link rel="stylesheet" type="text/css" href="appstyle.css" />");

これを次のように変更してみてください。

document.write('<link rel="stylesheet" type="text/css" href="appstyle.css" />');

または適切なエスケープを行います

document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"appstyle.css\" />");
于 2012-12-22T18:15:23.713 に答える
3

試す：

location === window.location

コンソールで。

を出力しますtrue。これは、グローバル変数が既に設定されており、 の現在のオブジェクトをlocation指していることを示しています。あなたのコードでは、ブラウザーのリロードをトリガーする新しい値を割り当てることによって、その変数を変更しています。locationwindow

それを修正するには、変数に別の名前を使用してください。

var currentLocation = window.location.href;

または、コードを自己実行関数に入れて、グローバル スコープから分離します。

(function (){
  var location = window.location.href;
  if(location.indexOf('?app=true') > -1) {        
    document.write('<link rel="stylesheet" type="text/css" href="appstyle.css" />');
  }
}());
于 2012-12-22T18:53:13.233 に答える