SO と Web を検索した後、どのソリューションにも満足できませんでした。そこで、古いiPadのchrome、ff、つまりサファリとサファリで機能する新しいソリューションを思いつきました。
最初のセット スタイル:
<link rel="stylesheet" href="./codebase/touchui.css" data-title="default" type="text/css" media="screen" charset="utf-8">
<link rel="alternate stylesheet" href="./codebase/ios.css" data-title="ios" type="text/css" media="screen" charset="utf-8">
<link rel="alternate stylesheet" href="./codebase/jq.css" data-title="jq" type="text/css" media="screen" charset="utf-8">
<link rel="alternate stylesheet" href="./codebase/sky.css" data-title="sky" type="text/css" media="screen" charset="utf-8">
<link rel="alternate stylesheet" href="./codebase/green.css" data-title="green" type="text/css" media="screen" charset="utf-8">
属性「data-title」に注意してください。これはユーザー定義の属性です。
次に、この関数を使用してスタイル シートを変更します (アプリ スコープに設定していることに注意してください。標準関数にすることができます。
app = {}
app.styleSet=function(title) {
var i, a
var o;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++)
if (a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute('data-title') ) {
if (a.getAttribute('data-title') == title)
o = a
a.setAttribute("rel", "alternate stylesheet");
a.setAttribute("title", a.getAttribute('data-title'));
a.disabled = true
}
o.setAttribute("title", undefined);
o.setAttribute("rel", "stylesheet");
o.disabled = false
//app.cookieCreate("style", title, 365);
}