javascript
はじめに 最近スクレイピングするスクリプトを書く機会があったので次回のためにメモしておく。・主にHTMLでコンテンツが作られているページ。 ・Javascriptでページを生成しているページ。 この2パターンに対応する必要があった。後者に対応しておけば前者…
今回やりたかったのはログインが必要なページの取得。 単純にformをsubmitすればいいページとログインボタンをクリックするとjavascriptが動いてごにょごにょやってログイン処理へと遷移するパターンがあるのでそれぞれ実装してみたのでメモしておく。 form…
今回やりたかったのはURLをリスト化しておいて順次サイトにアクセスしてレスポンスを取得するということ。当初はopenとthenを複数書いていたけどURLの一覧を別ファイル化したかったので今回やりたい経緯となった。ついでに取得したHTMLをファイルに保存する…
はじめに 今回やりたかったのはこんな画面 スタートテンプレートでサイドメニューとタブのものがそれぞれあるのでそれらを参考にした。 実装 まずはベースとなるHTMLを作る。ion-nav-viewがあるだけ。index.html <body ng-app="starter"> <ion-nav-view></ion-nav-view> </body>app.jsで、 menu.html > tabs.html > conte…
バージョン1の話です。 ionic startで作られるcontrollers.jsは1ファイルだけど、大きくなると嫌なので分割できるようにしたいというのが今回やりたかったこと。 ひな形をつくる $ ionic start myApp tabs controllersを分割 controllers/_init.js angular.m…
こちらでとりあえず動かせたのでついでにボタンをクリックした後のhtmlも取得してみたのでメモ。htmlはボタンをクリックしたらテキストがページに追加されていく簡単なもの。index.html <head><title>テスト</title></head> <body> <div id="content"></div> <button id="btn-add" onclick="add();">追加</button><br/> <script> function add() { document.getElementById("content"</br/></body>…
やりたかったこと 今回やりたかったのはjavascriptでコンテンツを表示するページの解析。 今までもたまにスクレイピング用のスクリプト作ったことはあったけど、wgetやphpのfile_get_contentsで取得したhtmlを解析するようのものしかなかった。ちょっと調べ…
css詳しくないのに見よう見まねで書いててjavascriptで生成した要素のz-indexがどうにも効かなくてハマりました。 そのときの対応をメモ。ググってるz-index当てる要素はpositionがrelativeかabsoluteじゃないといけないって記事があってコレが原因って線で…
addEventListenerでclickに処理をセットしたのだが何とも押しづらかった。 全く押せないのでなく押しづらかった。iPhoneでは普通に押せるのにandroidだけ押しづらい。 HTMLが複雑で要素が入り組んでいたからその辺が原因なのかなと思って調べていただけどよ…
特定の要素をフルスクリーンにしてくれるAPI ただ端末によってできたりできなかったりなので対応可否で処理を分ける必要あり。 ちなみにiOSは使えなかった。今回使ってみてまぁよく使いそうと思ったのは以下らへん ・requestFullscreen 指定した要素をフルス…
はじめに 以下のような問題があってWebViewの使用を検討 ・開発中のアプリのある画面のデザインがけっこう複雑で実装するのに時間かかりそう。 ・HTML、CSSで実装するとそんなでもなさそう。問題点としてはこの画面でのユーザー操作によってアプリの他の画面…
はじめに babelifyとかいうモジュールのコードを見てたらstreamというのが出てきてよくわからなくなったのでとりあえずいじってみた内容はcsvを読み込んでtsvに変換して出力するだけtest.js #!/usr/bin/env node var fs = require("fs"), inherits = require…
はじめに アプリ作る時はクラッシュレポートしてるのにjavascriptのエラーでは全然やってなかった。 jsでも必要があればやったほうがいいかも。ということでメモ 実装 window.onerrorイベントでエラーハンドリングできるみたい window.addEventListener("err…
値渡し var a = 1; var b = a; b = 2; console.log(a); // => 1 console.log(b); // => 2 値渡し2 var a = "1"; var b = a; b = "2"; console.log(a); // => "1" console.log(b); // => "2" 参照渡し var a = [1]; var b = a; b[0] = 2; console.log(a); // …
es6の環境で動作確認した結果定義する var _p3 = "p3"; var obj = { p : 1, "p2" : 2, [_p3] : 3 }; console.log(obj); // => Object {p: 1, p2: 2, p3: 3} アクセスする console.log(obj.p); // => 1 console.log(obj["p2"]); // => 2 console.log(obj[_p3]…
はじめに ES6でのシンプルなものだけど共通化するとしたらこんな感じだろうか呼び出し側 import React from "react"; import FormPart from "./FormPart.jsx"; export default class Sample extends React.Component { constructor(props) { super(props); t…
よく使うpreventDefaultとstopPropagation。 reactでも普通に使える export default class Sample extends React.Component { onParent(e) { // リンク先への遷移を抑制 e.preventDefault(); } onChild(e) { // onParentへのイベントを抑制 e.stopPropagatio…
はじめに reactをes6で使った場合です。 地味にはまった。。。自分の場合は以下の2パターン> パターン1イベントリスナーでメソッド呼び出すときにbindしていない export default class Sample extends React.Component { onClick() { console.log(this.statu…
はじめに 最近、ちょっとjavascriptいじる機会があってiPhone、Androidでけっこう内容が異なる処理をしなくてはならなくなったのでコードを整理する用途でnode.js使ってみたのでメモindex.js import Ios from "ios"; import Android from "android"; import …
前提 $ watchify -v -t babelify src/index.js -o dist/index.jsこちらのコマンドが動くようにwatchify、babelify、browserifyはいれてあることとする。 使ってみる minifyifyインストール $ npm install minifyify --save実行 $ watchify -v -t babelify -p…
はじめに 以前に自分が作ったシステムで主にjqueryを使って作ったものがありました。 基本的には困ることはなかったのですが、特定のページだけ複雑になってきていじるのが嫌になってきました。。。作りたい画面のイメージとしてはこんなかんじメイン画面 モ…
はじめに やりかたわからなかったのでメモ やりたいことはvideoタグで再生した動画が終了したら画像を表示するだけ (posterの終了後みたいなイメージ)video.load()しなおせばposterが再表示されるようなのでこれ使えばやろうと思えばできそうだった。 けど、…
はじめに ちょっと前に自分なりに調べて放置になっていたのでまとめておく まず前提としてiPhoneとAndroidで全然違う。で、さらにios10とios9以下とでちがうのとchrome53以上と53未満でちがう。 端末やブラウザのバージョンで処理を切り分けるのがよいのかと…
ページから離れるときに何か処理をしたいと思ってiosでpagehideをハンドリングしていた。 ios9では 1. リンクで別ページへ遷移 2. タブを閉じて画面を閉じるときにはちゃんと発火されていただがios10では2.の場合に呼ばれなくなっている気がする。。。 何気…
検証用のコードは以下の様な簡単なものでsafariで確認 setInterval(function() { // 何か処理 }, 200);ios9では ・200msごとに実行される続ける ・別のタブを開くなど画面から離れる ・1000msごとに実行される続ける ・画面に戻る ・200msごとに実行される続…
はじめに 今回やりたかったのは特定の要素が画面に見えていたら何か処理をするということ。 要素が全て見えている場合と50%以上みえてるときを検知できるような想定 実装 全て見えているかを判定 var target = document.getElementById("target"); var offse…
はじめに 今回やりたかったのはユーザー操作でページから離れるときに何か処理がしたいということ。 で、とりあえず考えられる操作としては以下 ・ブラウザを終了したとき ・タブを閉じたとき ・別タブへ移動したとき ・別アプリへ移動したとき ・ホーム画面…
はじめに 今回やりたかったのは画像を選択するようなプルダウン。 検索してみたら、bootstrap-select.jsというのがありました。http://thdoan.github.io/bootstrap-select/ こちらからDL 実装 使い方は簡単でjsを読み込んで以下みたいな感じで使える。 boots…
はじめに adminLTEのサンプル使って棒グラフを表示しようとして比較対象なしのグラフを作ろうとしたらなぜかうまくいかなったのでメモ また、x軸のメモリの間隔もあけたかったのでついでにメモ作りたかったのはこんな感じのグラフ 実装 $(function () { Char…
はじめに 以前につくったサービスの改修で必要になった。どこかのブログに書いてあったのをコピーして動いたのでそれでよしとしていたのだが、今回はそれが1ページに複数必要になって問題が発生したので作り直してクラスにしてみた DOM操作にjQuery使ってい…
