- ベストアンサー
現在PCサイトを作成しています。
aaa.com?code=AAA aaa.com?code=BBB aaa.com?code=CCC ひとつのURLで3種類のコードを扱っています。 Code=AAAが表示する画像は「111」 Code=BBBが表示する画像は「222」 Code=CCCが表示する画像は「333」 と表示させたいのですがjavascriptの組み方が分かりません。 どのようにすればいいのでしょうか？
- あああああああああ（@rise_sa1212）
- お礼率24% (14/57)
- JavaScript
- 回答数4
- ありがとう数2
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
ぜんかくくうはくは、すべてをはんかくにおきかえてください。 <!DOCTYPE html> <title>イメージを切り替える</title> <meta charset="UTF-8"/> <style> dt { width:10em; border-bottom: 2px blue solid; margin: 1em 0; } dd { margin-bottom: 1ex; } em { color: green; } li { border-bottom:1px red dotted; width : 30em; } </style> <body> <h1>イメージを表示する（切り替える）</h1> <p> 大雑把に言うと、イメージを切り替えるには、二種類あるz <ol> <li>HTML 文書を読み込んでいる途中で、スクリプトでタグを書く方法 <li>HTML 文書を全部読み込んでから、スクリプトで画像を変更する方法 </ol> <p> 今回は、<em>１番目の方法</em>をとります。 <script> var hash = { AAA: '111.jpg', BBB: '222.jpg', CCC: '333.jpg' }; var querys = location.search.slice (1); // 先頭の"?"の文字を切り取る var query = querys.split (/&|;/g); // ";" もしくは "&" で切り分ける var i, q, name_value, obj = { }; for (i = 0; q = query[i]; i++) { name_value = q.split ("=", 2); // a=b=c=d 見たいな時に必要以上に区切らない。今回は２つだけ obj[decodeURIComponent (name_value[0])] = decodeURIComponent (name_value[1]); } if (! obj.code) obj.code = 'default.jpg'; // 書き出す document.write ('<p><img src="' + hash[obj.code] + '" alt="'+hash[obj["code"]]+'"></p>'); // hash[obj["code"]] でも hash[obj.code] でも可 </script> <dl> <dt>img 要素 <dd> <em>この要素は、インライン要素</em>なので、ブロック要素の中にあるべき <br> <p> などで囲む。 <dt>alt 属性での注意点 <dd> HTML(5) なら無くても可だけど、その図が何を示すのか説明があるべき。<br> 今回のように、alt と src が同じなのは、意味合い的にダメ。 <dd> HTML4x なら必須です </dl> でざいん せんす０！
その他の回答 (3)
- babu_baboo
- ベストアンサー率51% (268/525)
おはようございます。ねぼけてました。またていせい。 function getQuery (querys) { return (querys || location.search.slice (1)) .split (/;|&/g) .reduce ( function (r, q) { var nv = q.split ('=', 2); r[decodeURIComponent (nv[0])] = decodeURIComponent (nv[1]); return r; }, {} ); } に。 ?code=AAA;test=xxxx;pass=xxxxxxxx しっているとはおもうけど、ふくすうのあたいも、しゅとくかのうです。
お礼
ありがとうございます。度々ご質問なのですが、今回の結果をHTMLに出力させたい場合どうすればいいのでしょうか？ 一部の画像だけ差し替えたいのです。。。
- babu_baboo
- ベストアンサー率51% (268/525)
ぜんかくくうはくは、はんかくくうはくに、おきかえてから。 <script> //ひつようならしたをこめんあうと //if(!Array.prototype.reduce)Array.prototype.reduce=function(d){var c=this.length;if(typeof d!="function")throw new TypeError;if(c==0&&arguments.length==1)throw new TypeError;var a=0;if(arguments.length>=2)var b=arguments[1];else{do{if(a in this){b=this[a++];break}if(++a>=c)throw new TypeError;}while(1)}for(;a<c;a++)a in this&&(b=d.call(null,b,this[a],a,this));return b}; function getQuery (querys) { return (querys || location.search.slice (1)) .split (/;|&/g) .reduce ( function (r, q) { var nv = q.split ('=', 2); this[decodeURIComponent (nv[0])] = decodeURIComponent (nv[1]); return this; }, {} ); } var hash = { AAA: '111.jpg', BBB: '222.jpg', CCC: '333.jpg' }; alert (hash[getQuery ()['code']]) // document.getElementById ('hoge').src = hash[getQuery ()['code']]; </script> </body>
- sagamit
- ベストアンサー率37% (39/105)
window.location.href に現在の URL が入っているので、それを元に分岐すれば良いでしょう。
お礼
おおおおお！！！ できました！！自分では絶対出来なかったので感謝しかありません！本当にありがとうございました。