外部cssを変更（５）：toggleで2種類のcssテーマを切り替え、その状態へ第3のcssを動的に追加

赤色系テーマと緑色系テーマの2つの外部cssを「外部cssを変更（２）」と同様にtoggleで切り替えることができます。そこへさらに3番目の外部css（部分）をheadに追加して、スタイルを調整します。

今回調整したスタイルは、要素のcssのみを書き換えた方がずっと早いのですが、解説のため敢えて外部cssを追加して行っています。外部cssは追加するスクリプトは、「外部CSSを追加」をクリックして表示されるソースをご覧ください（jQueryを使用）。

また、「外部CSSを追加」をクリックした後に、「headのソース表示」をクリックすると、headタグ内のソースを表示します。そのラスト部分に第3のcss（linkタグ）が追加されていることが分かります。

       

　

ここにブルーのテキストが表示されれば、追加の外部cssが効いています。noneだったdisplayプロパティをinlineに変更しています。

$("#tuika").click(function() {
	$("head").append("<link>");
	css = $("head").children(":last");
	css.attr({
		rel: "stylesheet",
		type: "text/css",
		href: "css/tuika.css"
	});
});


[ダミーテキスト]　ポイントカードを発行し、商品の購入者に対し、次回以降の買い物の際に支払いの一部に充当できるポイントを提供する場合は、景品ではなく値引。 取引通念上妥当と認められる基準に従い、取引の相手方に対し、支払うべき対価を減額すること又は割り戻すことは、値引と認められる経済上の利益に該当し、景品表示法上の景品類には該当しません。
[ダミーテキスト]