JavaScript
リリースノート https://github.com/vuejs/vue-next/releases/tag/v3.0.0vue3マイグレーションガイド: イントロダクション https://v3.vuejs.org/guide/migration/introduction.htmlRFC https://github.com/vuejs/rfcs/tree/master/active-rfcs 後方互換性を…
フォームの状態を命名するとしたら 順に default disabled focus filled error
is....able 「...ができるか」という意味でよく使われるisClickable (クリックできるか) isScrollable（スクロールできるか）throwAway（捨てる）
ES6はIEで動かない旧書き方 <script> function timer(){ var now =new Date(); document.getElementById('timer').innerHTML=new.getSeconds() + ' 秒'; } var timerID =setInterval(timer, 500); </script>最近の書き方（ES6） <script> const timer = () => { var now =new Date(); …
function resize() { var modal_content =document.querySelector(".modal_content"); var contenttop = ( window.innerHeight - modal_content.offsetHeight)/2; (contenttop > 0 )? modal_content.style.top=contenttop+"px":modal_content.style.top=0+"p…
(function(){ var Modal = { init: function( setting ) { if ( setting != null && setting != undefined && typeof setting === "object" ) { this.data = setting; } }, /* @opt{object} target{Element}: [] */ loadrun: function( opt ){ console.log(M…
他の関数の引数として渡し、その関数内で実行されることを目的とする関数。 イベントハンドラもコールバック関数の一種です。
■外部スタイルシートの頭に記述する window.onload = function() {}HTMLの読み込みが完了してから実行させる為に記述する訳ですが、 onloadイベントハンドラは、複数の外部ファイルに記述した場合、実行されるのはひとつだけです。 HTMLファイル内で一番後ろ…
NODO探索の注意点： 改行は１つの要素として認識されるので、firstChildやlastchaildを使用する場合に注意が必要です。 そんな要素はありませんと言われてしまう事があります。 なお、昔の話でIE8以下では改行ノードは無視されていました。 通常のブラウザで…
■javascriptについて 大昔、language="JavaScript" と記載していましたが現在は非推奨となっています。 <script language="JavaScript"> //非推奨HTML4以前は、type ="text/javascript" と書きました。 <script type ="text/javascript">HTML5以降は、scriptのデフォルトがjavascriptとなり</script>…
ロールオーバには、javascriptとCSS版がある。マウスが操作された時、下記の状態を変化させる。 ・ノーマル ・マウスオーバー ・マウスダウン - ★★マウスオーバーJS版★★■その1 分かりやすく書いた初心者向けの書き方。 <li><a href="#mokuteki" id="sidenav01" onmouseover="overSN01();" onmousedown="downSN01();" onmouseout="outSN01();"><span>文字列1</span></a></li> <script type="text/javascript"> function o…
事前にCSSでフォントをemで指定する必要があります。 bodyに元となる font-size:16px; を入れて、 各タグの font-size:1.5em; 16px × 1×1.4倍で指定する必要があります。 全体的に大きくしたい場合は、bodyの値を変更すれば一律で変更されます。■その1 //フ…
ロード時に『var text_val=document.getElementById('input_txt').value;』 しても値が空なのは当然である。 入力（クリック）された後に値をに取得する。 ※jQueryを使い始めると混同するので注意。2.数値であるかの比較数値で無い場合のparseIntの戻り値はN…
javascriptは一般的にJS、javaはそのままjavaと呼ばれています。 javascriptはDOMなどの要素を使用する上で、少し多く行数を多く書かなくてはいけないので、 現在はもっぱら、マルチブラウザ対応されているjqueryを使用して記述します。 javascript MDNのサ…
JQueryとJSは混ぜて書ける。 JSを複数書くことも可能。 今回は、時刻の表示、入力、ボタンによるリセットをいくつかの方法で行ってみました。 ＜HTML＞ <html lang="ja"> <head> <meta charset="utf-8"> <meta http-equiv="Content-Script-Type" content="text/javascript" charset="utf-8" /> <title>イベント</title> <script src="../../jquery-1.9.1.min.js"></script> </meta></meta></head></html>
onclickは一つの要素に同じ種類のイベントは１つしか設定できない そこで、addEventListenerを使うのだが、IE8以下では対応していない。 E8以下に対応するためにはattachEventを使うのだが、ブラウザによって処理を分ける必要がある。 今回は、addEventListe…
＜jQueryの利点＞ ・クロスブラウザの処理を内部で行ってくれる。 ・ソースを簡潔に書ける。 （DOMContentLoadedの処理も簡単に複数書ける $(function(){ 〜 } ＜javascript＞ ・window.onload（HTMLの読込が終わってから処理。 1つの処理しかできない＝処理…
クロスブラウザに対応するClassの取得方法＜HTML＞ <html lang="ja"> <head> <meta charset="utf-8"> <meta http-equiv="Content-Script-Type" content="text/javascript" charset="utf-8" /> <title>document.querySelector</title> <script type="text/javascript" src="hellow.js" charset="utf-8"></script> </head> </html>
GitHubの検索ページhttps://github.com/search slideshowなどで検索ただの作業メモ（参考）http://tada0121.wordpress.com/2012/03/09/%E9%9A%99%E9%96%93%E3%81%AA%E3%81%8F%E3%83%96%E3%83%AD%E3%83%83%E3%82%AF%E8%A6%81%E7%B4%A0%E3%82%92%E6%95%B7%E3%8…
DOMの基本２で IE8以下では、『document.getElementsByClassName』が使えない事がわかった。 下記の『document.querySelectorAll』と『document.querySelector』も IE7以下で対応していない。 このようなクロスブラウザに対応するためには、 DOMの基本４のよ…
＜HTMLファイル＞ <html lang="ja"> <head> <meta charset="utf-8"> <meta http-equiv="Content-Script-Type" content="text/javascript" charset="utf-8" /> <title>Helloを表示</title> <script type="text/javascript" src="hellow.js" charset="utf-8"></script> </head> <body> <div id="div1"> </div></body></html>
image corrupt or truncated 汚れているか切り詰められたイメージReferenceError: getElementsByClassName is not defined ⇒参照エラー getElementsByClassName は存在しない。 ＝document.getElementsByClassName のdocumentを書き忘れていませんか？TypeEr…
FirebugでJavaScriptのエラーを見る場合は、 Firebugのアイコンをクリックし、[コンソール]タブで確認する事ができます。コンソールには次の機能があります。 ・JavaScriptの実行 ・エラーの出力 ・メッセージやログの出力console.log('7' == 7); とした場合…
オブジェクトの値の取得プロパティの値を取得するには、『.』を使ってプロパティ名を指定する。 オブジェクト名.プロパティ名var book ={ name:'Webの勉強方法', price:1235, Publishing:{ Author:'大和太郎', Release:'2015-04-16' ←※最後に『,』を入れると…
■javascriptを外部ファイルにした時に文字化けがおこる場合は、 文字コードを統一しましょう。1.テキストエディタの設定を確認する。 2.HTMLで表示するコードを指定する（メタタグにcharsetを指定） <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />3.JavaScriptタグにcharsetを指定する。 <script type="text/javascript" src="main.js" charset="uft-8"></script>⇒⇒⇒ 1.TeraPadの</meta>…
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </meta></head></html>
ActionScriptと同じ演算結果をブラウザに表示させなさい 繰り返し文は使わずに、そのまま計算式を作りなさい スクリプトはembed（埋め込み）で記述します 【JS課題01】 変数を使った計算式を書き、ブラウザに結果を表示させなさい。 10×（8＋12）÷4 の値は？ …
ECMAScript（エクマスクリプト） ECMA：European Computer Manufacturer Association（ヨーロッパ電子計算機工業会）が定めたJavaScriptの標準仕様JScript Microsoft社が開発し、Windows上で動作します。 ※行の終わりには必ずセミコロンを付けます。 <script type="text/javascript"> <!-- w</script>…
