JavaScriptが調べてもわからず、どうか教えて頂けないでしょうか?
画像をリンクに変えたいです。
var unList=[
{url:'#' , title:'大吉'},
{url:'#' , title:'中吉'},
{url:'#' , title:'小吉'},
];
for(var i=0; i<unList.length; i++){
document.write("<a href=",unList[i].url,">",unList[i].title,"</a>");}
上記に変更したところ
ボタンを押す前に結果(リンク)が左上に飛び出してしまい困っています。
参考にしたソース↓
<form action="#">
<div>
<h2>ここに運勢が表示される</h2>
<img src="●.png" id="un" alt="ここに運勢が表示される"><br>
<input type="button" value="今日の一枚" onClick="omikuji(document.getElementById ('un'));">
</div>
</form>
<script>
var omikuji = (function (getCookie, setCookie) {
var save = 31;
var unList = [
{ src: '1.png', alt: '大吉' },
{ src: '2.png', alt: '吉' },
];
return function (node) {
var d = node.ownerDocument;
var v = d./*@cc_on @if (1) parentWindow @else@*/ defaultView /*@end@*/;
var today = (new Date).getDate () + '';
var lastDay = getCookie.call (v, 'day');
var unsei;
var no;
if (today === lastDay)
unsei = unList [Number (getCookie.call (v, 'un'))];
else {
no = Math.floor (Math.random() * unList.length);
unsei = unList[no];
setCookie.call (v, 'day', today, save);
setCookie.call (v, 'un', String (no), save);
}
node.src = unsei.src;
node.alt = unsei.alt;
};
})(
function () {
return (function (name) {
var d = this.document;
var n = encodeURIComponent (name).replace (/([.*()])/g, '\\$1');
var v = d.cookie.match (RegExp (n + '\\s*=\\s*(.*?)(?:[\\s;,]|$)'));
return v ? decodeURIComponent (v[1]) : '';
}).apply (this, arguments);
},
function () {
return (function (name, value, day, path, domain) {
var d = this.document;
var t = new Date;
t.setDate (t.getDate () + (day || 0));
d.cookie = encodeURIComponent (name) + '=' + encodeURIComponent (value) + ';' +
'expires=' + t.toUTCString () + ';' +
(path ? 'path=' + encodeURIComponent (path) + '': '') +
(domain ? 'domain=' + encodeURIComponent (domain) + ';': '');
}).apply (this, arguments);
});
</script>
No.1ベストアンサー
- 回答日時:
事前に表示させる場所を用意すること
例) 画像 <img id=un> の代わりに段落 <div id=fortune></div> を用意
表示させる位置の親要素を取ること
例) var 親要素 = document.getElementById('fortune');
document.write ではなく
document.createElement / 親要素.appendChild
または 親要素.innerHTML を使うこと
https://developer.mozilla.org/ja/docs/Web/API/Do …
https://developer.mozilla.org/ja/docs/Web/API/No …
https://developer.mozilla.org/ja/docs/Web/API/El …
ボタン押した後に動く関数 omikuji の中で処理すること
Ogre7077様
ありがとうございました。
調べながら格闘していたので、大変助かりました。
頂いた内容を確認しながら行ってみます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript gasについて 1 2022/05/31 21:51
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- JavaScript ソースコードのいじる場所が分かりません。 1 2022/12/23 02:06
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
スマフォではボタンを表示させ...
-
なぜmatchメソッドがエラーにな...
-
gas スプレッドシートがアクテ...
-
イラレでナンバリングする方法
-
ローカルにあるファイルを検索...
-
【JavaScript】数当てゲームを...
-
vb.netでの記述方法について 以...
-
gas 日付けの加算
-
var exports = exports || {}; ...
-
JavaScriptで平日のみをカウン...
-
GASのエラー「undefined からプ...
-
1日1回だけ引けるjavascriptお...
-
C#OpenCv V4にのエラーに関する...
-
ASP.NETのコントロールの値をJa...
-
jsによって検索プルダウン、都...
-
GASでundefinedエラーが出ます
-
JavaScript でのリアルタイム時...
-
翌月を取得するGASが分かりません
-
nullまたはオブジェクトではあ...
-
極小コードに挑戦!part2 数列...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
var exports = exports || {}; ...
-
google apps scriptの終了のさせ方
-
C#OpenCv V4にのエラーに関する...
-
GASでundefinedエラーが出ます
-
ジェネレーターの作り方
-
GASでGoogleフォームの自動返信...
-
HTMLで作った時報アプリが動き...
-
javascriptでテーブルに追加し...
-
html javascript リンク先アド...
-
【西暦等の変換】
-
ローカルにあるファイルを検索...
-
ASP.NETのコントロールの値をJa...
-
なぜmatchメソッドがエラーにな...
-
翌月を取得するGASが分かりません
-
gas スプレッドシートがアクテ...
-
ASP.NET MVCでObjectをjsに渡す
-
カンマで終わってるのはセミコ...
-
JavaScriptで文字列の特定文字...
-
javascriptでiframeのURL変更は?
-
APIを使って埋め込んだグーグル...
おすすめ情報