読者です 読者をやめる 読者になる 読者になる

ねっとぱんだ

webdesignとprogramingの勉強ブログ。

javascriptの勉強 3月23日 ランダム関数と条件分岐

random関数とif構文を使ったおみくじ var omikuji =parseInt(Math.random() * 10) + 1; console.log(omikuji); if (omikuji == 1){ console.log('大吉'); }else if(omikuji ==2){ console.log('中吉'); }else if(omikuji <= 4){ console.log('小吉'); }else …

javascriptの勉強 3月23日 演算子の復習

以前学習したことや今日学習した事の復習と補填です。演算子 変数は代入されない限り変化しない。 var num = 50; //50+50で100と表示 console.log(num + 50); //numのみが呼び出され50と表示 console.log(num); 演算子計算などに使用する記号 算術演算子 主…

javascriptの勉強 3月22日② random関数とparaseInt関数

今日勉強した事の復習と補填です。randam関数 パラメータ{ ()内の値 } 無し 返り値 0.0以上1.0未満の乱数。 メソッドが呼ばれるごとに0.0以上1.0未満までのランダムな浮動小数点を計算して返す。 擬似乱数が生成される。(擬似乱数:乱数列のように見える計算…

javascriptの勉強 3月21日①

今日学習した事、今まで学習した事を復習しました。console.log( ); console この部分をオブジェクトという。どこに指示を出すかという指定。 log( ) この部分をメソッドという。何をさせるかとう指示。 ( )の中身 パラメーターと言う。指示に必要な情報を入…

【javascript】ポップアップウィンドウを作る(Todays code)

javascriptでフラットなポップアップウィンドウを作りました。画像ごとに値を取得して違う画像を表示します。 ボタンのホバーアニメーションも少し練習しました。ポップアップウィンドウ ●DemoHTML(top page) <html lang="ja"> <head> <meta charset="UTF-8"> <title>lightbox</title> <link rel="stylesheet" href="style.css"> </link></meta></head></html>

【javascript】get引数、openメソッド、locationserch等

以前、下の記事で練習したコードのプロパティ等を詳しく確認します。pandafam.hatenablog.com get引数変数aに、bb.html(htmlへのリンク)に?=c(cの変数には後から値を入れる)を入れる。 var a="bb.html?="+c; openメソッド新しくウィンドウを開かせるメソッド…

【javascript】ボタンごとに別ウィンドウで違う画像を表示【Todays code】

それぞれのパンダをクリックすると新しいウィンドウで大きい画像が表示されます。 ●DemoHTML(top page) <html lang="ja"> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="../style.css"> <script type="text/javascript"src="../script.js"></script> </head> <body Onload="view();"> <p>nihao</p> <div id="img">…</div></body></html>

【japascript】1ページで内容が切り替わる【Todays code】

javascriptでコンテンツが切り替わる動きを作りました。コンテンツが切り替わるtabをクリックで内容が切り替わります。●DemoHTML <html lang="ja"> <head> <meta charset="UTF-8"> <title>a</title> <link rel="stylesheet"href="style.css"> <script type="text/javascript" src="script.js"></script> </head> <body> <div class="container"> <ul> </ul></div></body></html>

【HTML+CSS+JS】クリックでDOMを操作【Todays code】

javascriptでDOMの操作を勉強しました。DOMを追加するボタンを押すと🐼が現れ、ボタンが消えます。●Demohtml+css+javascript <html lang="ja"> <head> <meta charset="UTF-8"> <title>a</title> <style> .box{ font-size:50px; text-align:center; line-height:200px; background:#ffdddd; height:200px; width:200px; margin:0 a</meta></head></html>…

javasriptでDOMへの書き込みなど Todays code 3/14

毎日1つ以上、コードの反復練習。今日練習したコードconfirmでtrueならstyleが書き出される。 <script>// var x=window.confirm("背景に色を付ける"); if(x==true){ document.write("\ <style>\ body{background:#f00;}\ </style>\ "); } </script> ・confirm 直訳:確認するデ…

TodaysCode 3/12 -javascript-

今日練習したコードquerySelectorAllによる値の取得 <html lang="ja"> <head> <meta charset="UTF-8"> <title>a</title> <script> function init(){ var res=document.querySelectorAll("div p"); //querySelectorresによってresにdiv pを呼び出します。 for(var i=0;i</meta></head></html>

javascroptでDOMを指定する

javascriptでDOMを指定する記述を勉強しました。headerとbodyの指定 document.head document.body scriptをhead内に記述する場合(init 直訳:~の中に) <body>タグの中に<body onload="init();">と入れる。 処理をfunction init(){ }の中に記述 id,name,class,tagの指定id 変数=document.get</body></body>…

javascript 関数

関数 function 関数名(引数1 引数2){ 実行する処理。 } 例 function sum(num1, num2, num3){ } sum(1, 2, 3); sum(4, 5, 6); function sum(num1, num2, num3) → 関数sumが記述され、 sum(1, 2, 3); → num1に1、num2に2、num3に3が代入される。 sum(4, 5, 6);…

javascript 条件分岐構文

条件分岐if else書き方1 if(条件) trueの時の処理 else falseの時の処理 if else書き方2 if{ trueのときの処理 }else{ falseのときの処理 } else if if(条件1){ 条件1がtrueの時 }else if(条件2){ 条件2がtrueの時 }else{ 全て正しくないとき } switch sw…

Javascript 変数、定数、配列、演算子

変数について予約語varを使って宣言。 var 変数名; var 変数名,変数名 var : variable(変わりやすい,変化しやすい) 宣言&代入 var 変数名 = 値; var 変数名 = 値,変数名 = 値,…; 定数 const 変数="値"; (値が変更できなくなる。) 配列 変数=[値,値,…] 一…

Javascriptの記述2

Javascriptの記述法について勉強した事をまとめます。Javascriptの記述方法HTML内に記述ブラウザでHelloと表示されます。 <html> <body> <script> document.write("Hello ") </script> </body> </html> 外部から読み込み外部からsample.jsを読み込みます。 <script src="js/sample.js"></script> 文章を改行する時は(バックスラッシュ) docu…

Javascriptの記述

Javascriptの記述法について勉強した事をまとめます。Javascript記述の基本 大文字と小文字は区別される セミコロンで文が終わる。 処理が完結しており改行されていれば終わり。 改行してあってもまだ続く記号があったり、分が未完結なら改行の次も続いてい…