「黄金長方形の軌跡」で回転せよ!そこには「無限に続く力」があるはずだ・・・

  • このエントリーをはてなブックマークに追加
  • LINEで送る

javascriptの練習。
黄金比と白銀比を計算するフォーム。 > (ポップアップで開く)ポップアップはIEじゃ動かなかったなぁ。

作ってる途中で思った事、勘違いした事などを思い出してメモ

getElementsByTagName

こんなhtmlがあった時
[html]
<form>
<input type="text" value="1" />
<input type="text" value="2" />
<input type="text" value="3" />
<input type="text" value="4" />
<input type="text" value="5" />
</form>
[/html]

次みたいな書き方したら全てのinputタグにアクセスして、valueを「チェンジ」に変更できると思ってた。でも出来ない。
[js]
document.getElementsByTagName("input").value="チェンジ";
// 結果:1,2,3,4,5
[/js]

こうする。
[js]
var inputAll=document.getElementsByTagName("input");
for(var i=0;i<inputAll.length;i++){
inputAll[i].value="チェンジ";
}

// 結果:チェンジ,チェンジ,チェンジ,チェンジ,チェンジ
[/js]

.onkeyup

なんか入力したら処理。
submitボタンとblurかfocusで計算を開始させていたんだけど、面倒臭かったのでonkeyupにした。
[js]function funckeyupS(){
var cdbox=document.getElementById("cd-box");
var obj=cdbox.getElementsByTagName("input");
for(var i=0;i<obj.length;i++){
obj[i].onkeyup=function(){
calSilverRatio(this.value,this.name);
}
}
}[/js]
forの中”this”が自分を参照してた、これ普通だっけ?
iを使うと最後のiしかとれないんだっけ?

isFinite(変数とか数式とか文字列とか)

数値かどうか調べる、数値ならtrueを返してくれるらしい。

それなのに不思議だなと思う事。
[js]
/*
&goldvalue=inputに入力された数字
goldenRatio=黄金比
$a=1の辺
$b=0.618の辺
$ab=1.618の辺
*/
//$goldvalueが$aの辺で、入ってる数字が309だとして
function calGoldenRatio(goldvalue){
var $goldvalue=Number(goldvalue); //数字にして

if(isFinite($goldvalue)){ //判定
$b.value=Math.round($a.value/goldenRatio); //四捨五入して$bへ
$ab-ng.value=$a.value+$b.value; stringの309191が入る
$ab-ok.value=parseInt($a.value)+parseInt($b.value); //500になる
//$ab.value=Number($a.value)+Number($b.value);どっちがいいの?
}[/js]

parseInt()かNumber()を使わないと
どっちも数字のハズの$a.valueと$b.valueを足してるのにstringになる。
第2引数を指定してないparseInt()は、01や02などの文字列を渡すと8進数と解釈するらしい。

その他

ifで分岐させるとき、「値が入ってなかったらtrue」みたいにしたい時
[js]if(!変数) //これはtrueになると思ったけど期待通りに動かなかった
if(変数==null) //こっちも
if(変数==”) //これはokだった[/js]
どうやるのが正しいんだろう。

あと何か思い出したら書いていきます。

  • このエントリーをはてなブックマークに追加
  • LINEで送る

SNSでもご購読できます。

コメント

コメントを残す


You can add images to your comment by clicking here.