外出自粛中でも楽しく過ごす!QAまとめ>>

<img src="photo.jpg" title="" id="2" />
document.getElementById('2').setAttribute('title',代入値);

のようにsrcのほうにも値を設定したいのですが、単純に

document.getElementById('2').setAttribute('src',代入値);

のようにしてもできませんでした。srcに値を設定するにはどうしたらよいでしょうか?

このQ&Aに関連する最新のQ&A

A 回答 (1件)

まず、数字だけのidをつけるのは、やめたほうがいいでしょう。

(参考URL)

さて、本題ですが、私のところでは
 document.getElementById('2').setAttribute('src','photo2.jpg');
のようにしたところ、上手くいきました…
文字列の前後に「''」をちゃんとつけていますか?

参考までに、他に
 document.getElementById('2').src = 'photo2.jpg';
という、単純な方法もあります。

参考URL:http://www.kanzaki.com/docs/html/htminfo12.html# …
    • good
    • 1
この回答へのお礼

回答ありがとうございます。
document.getElementById('2').setAttribute('src','photo2.jpg');
のようにしてうまくいきました。ありがとうございました。

お礼日時:2008/12/07 13:02

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qhtml で 変数を定義できますか?

html(できればjava不使用)で変数に文字列をいれてつかう、またはそれに近いことはできないでしょうか?

例**************************
$color1="#000000"

<tr bgcolor=$color1>内容1<tr>
<tr bgcolor=$color1>内容2<tr>
****************************
みたいな感じです

Aベストアンサー

調べりゃ分かることは???だけど。

CSS2で無理やり作れば・・簡単だけど・・・
生成内容、自動番号振り、リスト ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/generate.html )
 本来はXSLTで作るほうがよいかと・・・
 <th><xsl:value-of select="parson" />の歌</th>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
<title>サンプル</title>
<meta name="author" content="ORUKA1951">
<meta http-equiv="Content-Style-Type" content="text/css">
<link rev="made" href="mailto:orika1951@hoge.com" title="send a mail" >
<link rel="START" href="../index.html">
<style type="text/css">
<!--
.parson1:before{content:"田中";}
p.age1:after{content:"36歳";}
-->
</style>
</head>
<body>
<h1>サンプル</h1>
<p class="parson1">は男の子</p>
<p class="parson1 age1">の年齢は</p>
<p>私の彼氏は<span class="parson1">君だよ</p>
</body>
</html>

調べりゃ分かることは???だけど。

CSS2で無理やり作れば・・簡単だけど・・・
生成内容、自動番号振り、リスト ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/generate.html )
 本来はXSLTで作るほうがよいかと・・・
 <th><xsl:value-of select="parson" />の歌</th>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
<title>サンプル</title>
<met...続きを読む

QonClickに複数の関数を挿入する方法

初心者なのですがアニメーションの関数anime1、anime2、anime3を作成し、onClickに下記のように設定しました。
クリックするとアニメーション2つの設定ではは動くのですが、3つ目を設定すると動かなくなります。
通常はこのような設定はしないものなのでしょうか?
教えてください。
よろしくお願いします。
<INPUT type="button" value="START" onClick="anime1(), anime2()">・・・OKです。
<INPUT type="button" value="START" onClick="anime1(), anime2(),anime3()">・・・動きません。

Aベストアンサー

セミコロンでつなぐのが常道ですが、3つ以上なら
別途function化したほうが、可読性が高くなると
思います。

Qjavascript src書き換え

javascript 初心者なのですが、質問させてください。

クリックした画像を3.jpgに書き換えるというコードを書いたのですが、うまく動きません。
どこが違間違っているのでしょうか。

/-------------------------------------------------------------/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>神経衰弱</title>
<style type="text/css">

ul {
width: 300px;
list-style:none;
margin: 0;
padding: 0;
}

li {
float:left;
margin: 0;
padding; 0:
}

img {
vertical-align: bottom;
}

#all {
width: 300px;
margin: 0px auto 0px;
margin-top: 50px;
}

</style>
</head>
<body>

<div id="all">
<ul>
<li><img src="none.jpg" alt="3" width="100px" height="100px" id="c_1" onclick="conce(c_1)" /></li>
<li><img src="none.jpg" alt="1" width="100px" height="100px" id="c_2" onclick="conce(c_2)" /></li>
<li><img src="none.jpg" alt="4" width="100px" height="100px" id="c_3" onclick="conce(c_3)" /></li>
<li><img src="none.jpg" alt="4" width="100px" height="100px" id="c_4" onclick="conce(c_4)" /></li>
<li><img src="none_2.jpg" alt="" width="100px" height="100px" id="c_5"/></li>
<li><img src="none.jpg" alt="2" width="100px" height="100px" id="c_6" onclick="conce(c_5)" /></li>
<li><img src="none.jpg" alt="1" width="100px" height="100px" id="c_7" onclick="conce(c_6)" /></li>
<li><img src="none.jpg" alt="2" width="100px" height="100px" id="c_8" onclick="conce(c_7)" /></li>
<li><img src="none.jpg" alt="3" width="100px" height="100px" id="c_9" onclick="conce(c_8)" /></li>
</ul>
</div>

<script type="text/javascript">

function conce(aaa){
document.getElementById("aaa").src = "3.jpg";
}



</script>
</body>
</html>
/-----------------------------------------------------------------------/

よろしくお願いします。

javascript 初心者なのですが、質問させてください。

クリックした画像を3.jpgに書き換えるというコードを書いたのですが、うまく動きません。
どこが違間違っているのでしょうか。

/-------------------------------------------------------------/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />...続きを読む

Aベストアンサー

引用符が付け間違えしています

誤: <img src="none.jpg" id="c_1" onclick="conce(c_1)" />
正: <img src="none.jpg" id="c_1" onclick="conce('c_1')" />

誤: document.getElementById("aaa").src = "3.jpg";
正: document.getElementById(aaa).src = "3.jpg";

本質ではありませんが、一緒にこれも直しましょう

誤: <img width="100px" height="100px"
正: <img width="100" height="100"

Qidを使わずにonclickで自身の要素取得

javascriptで
<a href="XXX.XXX" title="ゴール" onclick="element()">test</a>
function() {
idを使わずにここにtitle属性のゴールを習得する方法を記述したいのですが、わかりません
よろしくお願いします
}

Aベストアンサー

こんにちは。


==== HTML
<a href="" title="ゴール" onclick="getTitle(this);return false;">test</a>
<a href="" title="スタート" onclick="getTitle(this);return false;">test2</a>


==== JavaScript
function getTitle ( obj ) {
var title = obj.getAttribute('title');
alert ( title );
}

こういうことでしょうか。
違っていたらすみません。

Q変数の受け渡しによる画像の表示

こんな感じで変数の受け渡しによる画像の表示をしたいのですけど、うまく出来ません。どなたか宜しくお願いします。
<?php
$gazou=$_GET['r'];
echo"$gazou";
//変数の取得(1です)は出来ています。
echo'<IMG src="http://127.0.0.1/firstimage/"$gazou"..jpg" name="img2" border="0">';
?>

Aベストアンサー

シングルクォートの中では、変数は展開されないので、
echo '<IMG src="http://127.0.0.1/firstimage/'. $gazou . '.jpg" name="img2" border="0">';
のようにしてみて下さい

QJavaScriptde途中で、「exit」するには?

function kensaku(){
s_data = document.kaiin_form.input_name.value;

if(!s_data){ alert("キーワードを入れて下さい!"); }

if(s_data != dumy){ ...... }
for(i=st_no;i<=n;i++){
......省略.................;
.......省略................}
}

----------------------------------
3行目で表示されたアラートをOKで閉じても、4行目以下が実行されてしまいます。
3行目でexitするにはどうすれば良いでしょうか?

Aベストアンサー

>関数(kensaku())からは抜けられませんでした。
そうですね、勘違いしていました、f(^^;
すみません。
if(!s_data){
alert("キーワードを入れて下さい!");
return;
}
ですね。

QHTMLファイル同士での値渡し

困っています。

HTMLファイルからHTMLファイルへ移動するときに、
HTMLファイル1でJavaScript で算出された値を
HTMLファイル2へ渡して使用したいのです。

showModalDialogだとダイアログにしか渡せないし・・・。
このように、値をそのまま次のページに渡すための方法を教えてください。
お願いします。

Aベストアンサー

すみません。うっかりしてました。

document.write(FORM[v1]);
では、v1を変数と認識してしまうので、エラーになってしまいますね。

document.write(FORM.v1);  // 「FORM.v1」です
あるいは
document.write(FORM["v1"]);
としてください。

QHTMLフォームのSELECTの幅を一定にするためには?

HTMLフォームのSELECTの幅を一定にするためにはどのようにすれば
いいのでしょうか?

CSS等で設定できるとありがたいのですが、やり方がわかりません。

Aベストアンサー

<select style="width: 200px">

QgetElementByIdの戻り値がnullになります。

getElementByIdでdivタグのオブジェクトを取得したいのですが、nullとなってしまいます。
以下のコードのどこがいけないのでしょうか。
---
<div id='a'></div>

<script language="javascript">// <!--
var a_ = document.getElementById('a');
document.write(a_);
// --></script>
---

Aベストアンサー

さらに実験

<div id='a'></div>
<div></div>
<script type"text/javascript">// <!--
var a_ = document.getElementById('a');
document.write(a_);
// --></script>

これはnullですが

<div id='a'></div>
<div>あ</div>
<script type"text/javascript">// <!--
var a_ = document.getElementById('a');
document.write(a_);
// --></script>

これは[object]や[HTMLdivElement]が返りました。

Qjavascriptでセレクトボックスの"selected"を動的につ

javascriptでセレクトボックスの"selected"を動的につける方法について質問させてください。

現在、以下のようなフォームを作成しました。

<select name='year'>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
</select>月

<select name='day'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
<option value='13'>13</option>
<option value='14'>14</option>
<option value='15'>15</option>
<option value='16'>16</option>
<option value='17'>17</option>
<option value='18'>18</option>
<option value='19'>19</option>
<option value='20'>20</option>
<option value='21'>21</option>
<option value='22'>22</option>
<option value='23'>23</option>
<option value='24'>24</option>
<option value='25'>25</option>
<option value='26'>26</option>
<option value='27'>27</option>
<option value='28'>28</option>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日


このセレクトボックスに、例えば今日の日付"2010年9月30日"だったら、それぞれの年、月、日の<option>に"selected"をつけたいのですが、javascriptではどのようにして実現したら良いのでしょうか?

よろしくお願いします。

javascriptでセレクトボックスの"selected"を動的につける方法について質問させてください。

現在、以下のようなフォームを作成しました。

<select name='year'>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8...続きを読む

Aベストアンサー

こんな感じで・・・

<script>
window.onload=function(){
var f=document.getElementById("f0");
var ymd=new Date();
checkSelect(f.elements["year"],ymd.getFullYear());
checkSelect(f.elements["month"],ymd.getMonth() +1);
checkSelect(f.elements["day"],ymd.getDate());
}
function checkSelect(obj,val){
for(var i=0;i<obj.length;i++){
if(obj[i].value==val){
obj[i].selected=true;
break;
}
}
}
</script>
<form id="f0">
<div>
<select name='year'>
<option value='2009'>2009</option>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
</select>月

<select name='day'>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日
</div>
</form>

こんな感じで・・・

<script>
window.onload=function(){
var f=document.getElementById("f0");
var ymd=new Date();
checkSelect(f.elements["year"],ymd.getFullYear());
checkSelect(f.elements["month"],ymd.getMonth() +1);
checkSelect(f.elements["day"],ymd.getDate());
}
function checkSelect(obj,val){
for(var i=0;i<obj.length;i++){
if(obj[i].value==val){
obj[i].selected=true;
break;
}
}
}
</script>
<form id="f0">
<div>
<select name='year'>
<opt...続きを読む


人気Q&Aランキング