2018-01-01から1年間の記事一覧
1. interfaceを使ってメソッド拡張まがいなことができる。 2. objectの定義に{key?:string, key2?:number}等と?をつけると省略化になる。 3. thisの用法が違う。
Jquery plugin プラグインの例 jquery.hoge.js (function ($) { $.fn.hoge = function () { return $("p").click(function () { console.log("test!"); $(this).text("hello!"); }); }; })(jQuery); これをjqueryとともにhtml側で読み込んでおく。 タイプス…
どれくらいつかえるか Can I use... Support tables for HTML5, CSS3, etc
Webアプリ環境 npm パッケージマネージャ TypeScript 型付きのjavascrpt WebPack TypeScriptやHTMLのパーツ化のために使用 Babel (今回使わなかった。) JSのバージョン吸収 npm プロジェクトでパッケージ管理をスタートしたい場合 npm init ではじめられる。…
Vue.jsのサンプルを打ち込んでみた。 簡単につかえるようだ。 <div> <div id="app-2"> <span v-bind:title="message"> Hover your mouse over me for a few seconds to see my dynamically bound title! </span> </div> <div id="app-3"> <span v-if="seen">Now you see me</span> </div> <div id="app-4"> <ol> <li v-for="todo in todos"> {{ todo.…</li></ol></div></div>
webpackのhtml-loaderを使ってhtmlをjavascriptで読み込んだ使う。 html-loaderのインストール。 npm install html-loader webpack.config.jsを設定 module.exports = { entry: './app.js', output: { path: __dirname + "/dist", filename: "bundle.js"; },…
参照フォルダとして追加したいものをプロジェクトにドラッグして参照フォルダして登録、 Bundleをみるとフォルダごとアプルに入ることがわかる。よってパスはBundle.main.bundlePathを起点に相対パスを追加していけば良い。
1. InputEventは型定義を読み込んだ。 npm install @types/dom-inputevent 2. 定義されてないものはinputEvent["inputType"]で取れた。 3. 定義していないプロパティも input["oldValue"] = input.value;で代入できた。 4. childNodesはArray.prototype.forE…
TypeScript https://ics.media/entry/16329 インストール typescript また、webpackで使用するために ts-loader もインストール 設定ファイル ルートにtsconfig.json { "compilerOptions": { "sourceMap": true, "target": "es5", "module": "es2015" // 出…
WebPack https://webpack.js.org/ 読み込んで使う。エントリーポイント //spc/index.js import bar from './bar'; bar(); 読み込まれる側 //src/bar.js export default function bar() { // } これを設定するにはwebpack.config.jsを作る。 const path = req…
npm パッケージ管理スタート npm init これでpackage.jsonが作成される。 ローカルインストールは /node_modules 内にインストールされる。 -gをつけるとグローバルインストール。 アンインストールは uninstall パッケージのアップデートは update パッケー…
とっかかりをつくってみた。 const toStr = (t) => { if (t == null) { return "null"; } else { return t.toString(); } } /** * * @param {Node} node * @returns {string} */ function nodeDesc(node) { const list = [node.nodeName, node.nodeType, nod…
flexを使うほうが調整が簡単なことがわかった。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>List</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> <link rel="stylesheet" type="text/css" href="style.css"> </link></meta></meta></head></html>
書いてみたが使わなくて良いみたい。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>List</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> <link rel="stylesheet" type="text/css" href="style.css"> </link></meta></meta></head></html>
まだぐしゃぐしゃだがやはりスタイルはまとめて他の場所に書くほうがすっきりするようだ。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>List</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> </meta></meta></head></html>
更に色々書いてみた。 /** * @type{HTMLDivElement} */ const listBox = document.getElementById("listBox"); const toStr = (t) => { if (t == null) { return "null"; } else { return t.toString(); } } /** * * @param {Node} node * @returns {string}…
色々javascriptを書いてみた /** * @type{HTMLDivElement} */ const d = document.getElementById("cell"); /** * @type{HTMLDivElement} */ const listBox = document.getElementById("listBox"); const toStr = (t) => { if (t == null) { return "null"; …
あっているかはわからない。 <div id="box" style=" width: 300px; display:flex; flex-grow: 1; align-content: center; align-items: center; flex-direction: column;"> <a href="http://localhost"> <img src="./menu/01.png"/> </a> <a href="http://localhost"> <img src="./menu/02.png"/> </a> <a href="http://localhost"> </a></div>
とほほのサイトに色々書いてある。 /*jshint esversion: 6 */ // import {hello_world} from "mymodule.js"; // http://www.tohoho-web.com/js/index.htm //document.write("Hello World") //alert("Hello world!!"); const id_container = "container"; ///…
UINavigationController.delegateがassignからweakになっている。 つまり、weakと思っていたらiOS8はassignになっているので注意。。orz
イマドキのJavaScriptの書き方2018 - Qiita1. 関数はfunction() {} 2. window.onload = hogeFunction;で読み込み時に読まれる 3. DOM要素の取得 const myC = document.getElementById("myC"); 4. 子要素にHTMLを入れる。 myC.insertAdjacentHTML("beforeend"…
３０分で覚えるKotlin文法 - Qiita SwiftとKotlinの文法を比較してみた(基礎パート) - Qiita 1. 変数は可変がvar, 不変がval 2. ラムダ式は x -> x 3. タプルはPair, Triple 4. 辞書はmapOf, mutableMapOf 5. ログはprint(), prinln(), "xxx ${hoge} "で変数…
1. AndroidのWebViewはLayoutで置く。 2. loadURLでURLの読み込み 3. AndroidManifestに の記述がいる。 4. AssetフォルダはNewのFolderから作れる。 5. Assetフォルダにはファイルをペーストで中に入れられる。 6. ローカルファイルの読み込みはwebView.loa…
iOSWorksのWebAppTestにサンプルコードを作った。 初歩 0. import WebKitがいる。 1. 古いOSに対応させる場合、WKWebViewは直接生成する必要がある。 2. WKNavigationDelegateのnavigationActionのrequestでwebView側でURLが変更された際の情報が入ってくる…
ワークスペースのadd Filesで既存のプロジェクトファイルを選択し追加する。この時既存のプロジェクトは閉じていないとならない。
iOS8からAppGroup内で情報共有できる。つまり同じDeveloper内という制限がある。 Keychainを使わないでも良い。 Group IDを指定してNSUserdefault(suiteName)やNSFileManagerでデータを取得する。
秒まで指定できるUIPickerViewを作ってみた。 GitHub - KatagiriSo/RDDateAndTimes: dates, hours, minutes and second picker utility
TinyTeX - A lightweight, cross-platform, portable, and easy-to-maintain LaTeX distribution based on TeX Live - Yihui Xie | 谢益辉
定数 enum class hoge { A,B,C } protected protectedは派生クラスからでも呼べる。
https://developer.apple.com/library/content/qa/qa1795/_index.html developer.apple.com dev.classmethod.jp
