忍者ブログ

からすまる日誌 JavaScript

実践(6) テストの予習/三項演算子

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

実践(6) テストの予習/三項演算子

forでまわして要素を追加する
 
手順
①条件分はi小なりと記述
var eleをまず作成
③作成するときは要素をダラー、括弧・シングルコート・大なり<>の4要素で囲う。大なりが一番内側(ダラー・ま・し・だ)
④eleには生成要素と.textなどを使う
子要素を追加するときはappendを使う。
⑥親要素の指定はダラー、丸括弧・シングルコート・idもちなら#の4指定がいる。(ダラー・ま・し・#)
 
変数はシングルコートで囲わない
 

on clickで作動
$('#btn')で指定
ダラーは括弧の外に書く、ダラー、丸括弧・シングル・#(ま・し・#)
②functionの終了の}には;をつけないらしい。書いても害はない。 
 

条件文は1行ならこう書いてもいい
 
if(i==1) ele.css('color','#F00');
 
--->ここまで test1.js
 
$(function(){
 console.log('hoge');
 var langs=['java','javaScript','html','css','sql','php'];
 
 $('#btn').on('click',function(){
  for (var i=0; i<langs.length; i++){
   var ele = $('<li>').text(langs[i]);
   if(i==1){
    //$('li').css({'color':'#F00'});//これで論理エラーなのはまだeleが生成されていないのに赤くしようとしたから
    ele.css({'color':'#F00'});
   }else{
    ele.css({'color':'#00F'});
   }
   $('#tar').append(ele);
  }//ここに;はいらないらしい/書いても動く/特に意味のない;になる
 });
 
});
 

三項演算子(さんこうえんざんし) 
c系の言語には全部ある記述法らしい
複雑な処理はできない。複雑な時はifを使う。
シンプルで単純なケースには比較的利用される
 
条件 ? 真の処理 : 偽の処理;
 //三項演算子で記述
   i == 1? ele.css({'color':'#F00'}) : ele.css({'color':'#00F'});
 
→もっとシンプルに条件式に色だけにしたい 
 
いったん変数に真または偽の値を取得し、
次の行で当てはめる
 
   var hoge = i == 1? '#F00' : '#00F';
   ele.css('color',hoge);
 
こういう書き方がありますよということだけ頭に入れておくといい。
サンプルコードでいつか見るかもしれない。
 
PR

コメント

ただいまコメントを受けつけておりません。

ブログ内検索

P R