Javascript
chrome デベロッパーツールのbreakpointの他に ここをつけておくとエラーで引っかかったソースコードが見えるようになるので 原因を探るのに役立てられると分かった。
Promiseという概念を理解するに当たり以下の記事が大いに役に立った。こちらを読めば理解できる。 levelup.gitconnected.com levelup.gitconnected.com 以下は自分がPromiseについて整理するために記録しておく。 そもそも自分はaxiosを使っていて、どうやら…
javascriptで非同期処理を行う場合にcallbackを使用してきた歴史がある。しかし非同期処理を使う際にcallbackを多用する場合がありコードが読みにくくなる問題が生じた。 こうした背景のもと問題解決のためPromiseという概念を発明した。 then, async await…
javascriptで書かれたファイルを実行する方法を今更ながら知ったので記録しておく。 ブラウザで開いて実行する方法 今まで.jsファイルは該当の ファイルを選択してブラウザで開いてconsole.logとかを確認していた。 nodejsを使って実行する方法 それとは別に…
DOM操作の一つとしてcssを変更する。 pタグのcssのborderを"solid black 2px"に変更したい場合は要素のstyleプロパティにアクセスして変更すれば良い。 てことで、要素の取得する。その要素のプロパティを変更する。このステップを踏めば良い。 <p id='practice'>styleを変更</p>…
アンドロイドアプリを作る場合はアプリのストレージ領域に暗号化したTokenを保管し、通信を行うときだけそれを引っ張り出してリクエストヘッダにセットして通信を行っていた。クライアントがブラウザの場合にはブラウザに保存するのでどうやって保存して取り…
typescriptをやってPromiseの存在を知った。がPromiseという概念が未だに分からない。。。 少し触ってみて多少のasyc awaitを使う場合と使わない場合で何か異なることを発見したので備忘録としてメモしておく。 async await を使わない場合 private uploadIm…
mpaのdjnagoで画像をアップロードするにはフロントエンドではhtmlにinputタグ（type="file"）をセットして、何らかのボタンを押してpostメソッドで送信し、views.pyにてrequest.POSTのような形で画像データを取り出してやれば画像の取り扱いはできた。 しか…
大した内容ではないので問題点と対処法を軽く書く。 djangoのcontextに格納したデータをjavascriptにわたす方法 最初にviewにてデータをcontextに格納する テンプレートにてjavascriptを走らせ、contextのデータを受け取る def example(self, request, *args…
問題は何なのか leafletを使っていて以下の内容がconsoleに表示される事になった。 Mixed Content: The page at '<URL>' was loaded over HTTPS, but requested an insecure image '<URL>'. This content should also be served over HTTPS. これは何を示しているかと</url></url>…
Djangoにおいてformウィジェットの理解を深めない限り、forms.ModelFormやforms.Formの利用したとて、フォームを使った画面が残念な結果になってしまう。 見た目の良いフォーム画面を作るには htmlファイルを自ら作成して好みのformを作成する ModelFormやFo…
データバインディングとは データと描画を同期する仕組み データバインディングの種類 双方向バインディング （TwoWay） 単方向バインディング(OneWay) ワンタイムバインディング(OneTime) テキストのバインディング テキストのバインディングの場合には{{}}…
配列、リスト オブジェクトの生成 pythonにはListがある。 foods = ["りんご", "ぶどう", "すいか", "なし"] foods = list("りんご", "ぶどう", "すいか", "なし") kotlinにはList, Array, ArrayListがある。 var foods:List<String> = listOf("りんご", "ぶどう", "</string>…
内容 ドキュメント 基本的な使い方 vueの内容の書き方 1.ドキュメント https://jp.vuejs.org/ 2.基本的な使い方 HTMLとjavasciptのパートがあり、それを書けばvue.jsを書いたことになると現状認識している。 HTMLで書くこと https://jsfiddle.net/5grs0976/1…
django leafletはブラウザ上でgeo系のデータをマップに描画するものである。 特徴はjavascriptを一切書かずにOSMをブラウザ上に表示したり、geoデータをマッピングすることができる。 スマホ等にアプリを通じて描画する方法はGoogle Maps Platformを使って実…
ベース記事 Javascriptメモ 種類 配列 連想配列 疑問点 配列って何か？連想配列って何？なんのためにある概念？それができると何ができるようになるの？ それができると何ができるようになるの？ 配列と連想配列を使うと、複数のデータ集合を扱うことができ…
関連記事イベントとイベントハンドラの設定 addEventListenerの使い方意義としてはonclick等は一つのイベントに一つのイベントハンドラしか設置できない。一つのイベントに複数のイベントハンドラを設置するときにに役に立つ。サンプル使用例 <html lang="utf-8"> <head> <meta charset="utf-8"> <title>ボタンクリ</title></meta></head></html>…
ほか関連記事DOM操作について イベントとイベントハンドラ 本題loadはイベントの一つ。関連付けられた要素を読み終わったときに発生するイベント。 loadの有用性DOM操作をすると実行タイミングがずれることでエラーになることがある。この解消に2つの方法が…
ベース記事Javascriptメモ loadについて イベントとイベントハンドラの設定方法の種類２種類ある。 開始タグ内に両者を設置する方法 スクリプト内に両者を設置する方法（プロパティとして扱う） 1.開始タグ内に両者を設置する方法 <html lang="utf-8"> <head> <meta charset="utf-8"> <title>イベントとイベントハ</title></meta></head></html>…
ベース記事Javascriptメモ DOM操作について ユーザの入力値をブラウザ表示する[DOM操作] <html lang="utf-8"> <head> <meta charset="utf-8"> <title>フォーム内容をリストに反映</title> </head> <body> <label for="lists">リスト</label><br> <ul id="lists"> <li>リストがここに追加される</li> </ul> <input id="content" type="text" > </body></html>
![はてなブックマーク - ユーザの入力値をブラウザ表示する[DOM操作]](https://b.hatena.ne.jp/entry/image/https://torajirousan.hatenadiary.jp/entry/2018/10/28/054515)
ベース記事Javascriptメモ DOM操作について Nodeを置換する方法replaceChild()を使うと置換することができる。 大まかに言えばappendChild()を使ってノードを追加する方法とほぼ同じ。 違うところは、replaceChild()をの引数は２つあり、newNode, oldNodeの…
ベース記事DOM操作について Javascriptメモ ノードを追加するやり方やりたいイメージ：例えばカラの <ul></ul>があるとする。ここにリストタグを追加するということをやりたい。リストタグはエレメントというノードの一つである。 だからノードを操作するコードが分か…
ベースJavascriptメモ DOM操作について 基本的な使い方idをキーにする場合にはgetElementById()を使っていたけど、tagをキーにする場合は少し違う。ただほぼ同じ。getElementsByTagNameを使う。elementsでsが必要なこと、Nameを加えることに注意して記述した…
idをキーに要素を取得する tagをキーに要素を取得する javascript DOM操作でcssを変更する ノードを追加する Nodeを置換する loadについて サンプル：ユーザの入力値をブラウザ表示する
ベース記事DOM操作について Javascriptメモ 本題 例文 <p id="test">この要素を取得したい</p> <input type="button" onclick="print();"> <script> function print(){ var ele = document.getElementById("test"); console.log(ele); console.log(ele.innerText); } </script> まず最初にonclickってのがあるけど、これはhtmlのものなの…
ベース記事Javascriptメモ 一体どんなときに必要なのか？javascriptを勉強していると;を文末に書くことが度々ある。 これは必ず文末で必要となるわけでもないらしい。 頭がごちゃごちゃするルール（仮説）原則として文の終わりにセミコロンを付す。 例外は制…
ベース記事Javascriptメモ 種類 if/else if/else switch if/else if/else構文 if(条件式){ 条件式がTrueのときの処理 }else if(条件式){ 条件式がTrueのときの処理 }else{ 上記に当てはまらないのときの処理 }if文のみの場合、while文に似ている気がする。条…
種類 for文 while文 do while文 for文構文 for (初期化文; ループ継続条件; 増減式){ 繰り返し実行したい処理 }増減式には;を必要としない。書いたらunexpected token ; のエラーが出てしまうので注意。例変数iの値を1から3まで出力するプログラム for (var …
参考url : https://developer.mozilla.org/ja/docs/Web/JavaScript関連記事 繰り返し処理 条件分岐 配列 DOM操作について イベントとイベントハンドラの設定 セミコロンについて toLocalStringメソッド javascriptファイルを実行する方法 基本的な使い方使い…
