Works

html タグで作成したテキストエディタ

pre タグに contenteditable 属性を使用したテキストエディタ風のテキストエリアです。 文字の色を指定すると入力した文字に、色がリアルタイムに反映されます。 エラーするとキャレットが開始位置へ戻ります。_(:3」∠)_ 正規表現でのブラウザのクラッシュ修正?しました。 "特定の文字入力時にソースコードが表示されてしまう" を修正?しました。 "色設定文字に特定の文字登録でソースコードが表示されてしまう" を修正?しました。 キャレットの位置調整しました。 それに伴い、テキストエリア外でも値を取得する為、テキストエリアのイベントを document へ設定しました。 その為なのかは分かりませんが、ウェブ上ではキャレットの位置が、よくズレてしまうようです。 ローカルでの方が、うまく動くのかもしれません。ヽ(´ー`)ノ 複数行選択した状態でエンターキー押下でキャレットの位置がズレる他、すこし修正しました。 IE11, firefox でも動作するように修正しました。 ショートカットキー、ダブルクリックでのテキストの選択等、修正しました。 http://mathematics.namekuji.jp/script/textarea-color-c.html

  • 622
  • 0

html5.1 タグのブロック、インライン、振り分けテスト

html5.1 タグのブロックレベル要素、インライン要素、振り分けテスト getComputedStyle() 関数を利用して html5 タグを ブロックレベル要素、インライン要素に振り分けます。 javascript で取得できる値の中に、タグ一覧の値がないか 調べてみたんですけど、見つける事は出来ませんでした。_(:3」∠)_ html5.1 のタグは、こちらのサイトで確認しました。 → https://www.w3.org/TR/html51/fullindex.html#element-interfaces

  • 295
  • 0

CSV データの JSON 型変換 ( javascript )

CSV データの JSON 型変換 ( javascript ) CSV データを Array 配列, JSON 型データへ変換します。 str.getCSVArray(',',true) の第一引数に String 指定で区切り文字の設定。 第二引数に、 true 指定で、戻り値配列の 0 番に行配列、 1 番に列配列が出力されます。 指定無しの場合は、 CSV データ の Array 配列が出力されます。 最終行の末尾に区切り文字で配列が作成されない を修正しました。 最終行最終セル先頭が囲み文字の処理を調整しました。 半角スペース、タブの連続等、調整しました。 区切り文字に半角スペース指定出来るように調整しました。 http://mathematics.namekuji.jp/script/csv-convert-json-a.html

  • 51
  • 0

JSON データ を 配列 ( Array ) へ変換 :テスト 3

{ JSON データ を 配列 ( Array ) へ変換 } テスト 3 Object を配列に変換するテスト 3 です。 getJSONArray() 関数を実行すると、Object を Array 配列へ変換します。 戻り値の配列の 0 番に階層のない配列、Object が階層構造場合、 戻り値の配列の 1 番に 階層構造の配列を返すと思います。 第一引数, true で object のキャプション?を追加します。 Object 値が 空, null, false の場合、 Array 配列に格納されない、を修正しました。 JSON, Object, Array 配列を処理できると思います。

  • 68
  • 0

{ JSON データ を 配列 ( Array ) へ変換 } テスト 4

{ JSON データ を 配列 ( Array ) へ変換 } テスト 4 Object を配列に変換するテスト 4 です。 getJSONArray() 関数を実行すると、Object を Array 配列へ変換します。 第一引数, true で object のキャプション?を追加します。 第二引数に文字指定で、文字と同じ key の値を抽出して配列で返します。 戻り値の配列の 0 番に階層のない配列、Object が階層構造場合、 戻り値の配列の 1 番に階層構造の配列を返すと思います。 戻り値の配列の 2 番に第二引数で指定した配列を返します。 Object 値が 空, null, false の場合、 Array 配列に格納されない、を修正しました。 http://mathematics.namekuji.jp/script/json-data-cast-a.html

  • 101
  • 0

{ セル内改行 CSV データを配列 へ変換 } javascript

CSV データを Array 配列へ変換します。 str.getCSVArray(',') の第一引数に 文字で区切り文字指定。 半角スペースを指定することは出来ません。 囲み文字は、セル単位で、シングル、ダブルクォーテーションが混在していても処理できると思います。 囲み文字が連続した場合、最初と最後を一つだけ削除します。 囲み文字列前後の半角スペース、タブは、削除します。 囲み文字内であれば、改行が含まれていても、一つのセルの値として取得出来ると思います。 結果はコンソールへ出力されます。 囲い文字開始直後の区切り文字、 囲い文字入れ子終了直後の区切り文字で配列が増えてしまう、を修正しました。 最終行の末尾に区切り文字で配列が作成されない、を修正しました。 最終行最終セル先頭が囲み文字の処理を調整しました。 半角スペース、タブの連続等、調整しました。 区切り文字に半角スペース指定出来るように調整しました。 http://mathematics.namekuji.jp/script/csv-data-cast-a.html

  • 105
  • 0

セル内改行 CSV 配列変換 : エスケープ処理テスト

{ セル内改行 CSV データ配列変換, Ajax テスト } CSV データを Array 配列へ変換します。 str.getCSVArray(',') の第一引数に 文字で区切り文字指定。 半角スペースを指定することは出来ません。 囲み文字は、セル単位で、シングル、ダブルクォーテーションが混在していても処理できると思います。 囲み文字が連続した場合、最初と最後を一つだけ削除します。 囲み文字列前後の半角スペース、タブは、削除します。 囲み文字内であれば、改行が含まれていても、一つのセルの値として取得出来ると思います。 結果はコンソールへ出力されます。 エスケープ処理?を追加しました。 囲み文字のないセルで区切り文字をエスケープすると区切り文字を無視します。 囲み文字をエスケープすると囲み文字内の切り文字が有効になります。 囲い文字開始直後の区切り文字、 囲い文字入れ子終了直後の区切り文字で配列が増えてしまう、を修正しました。 最終行の末尾に区切り文字で配列が作成されない、を修正しました。 最終行最終セル先頭が囲み文字の処理を調整しました。 半角スペース、タブの連続等、調整しました。 区切り文字に半角スペース指定出来るように調整しました。 http://mathematics.namekuji.jp/script/csv-data-cast-ajax-a.html

  • 47
  • 0

ソースコードハイライト : javascript, css, html

ソースコードハイライト : javascript, css, html javascript, html, css のソースコードをハイライト表示します。 文字数の多いコードを表示させると、激重です。(*'ω' *) ハイライト表示させる文字を配列に格納している文字と比較しています。 ハイライトの処理が、うまくいかず、文字列の中に色付き文字が現れたりします。 http://mathematics.namekuji.jp/script/code-highlight-a.html

  • 17
  • 0

最大公約数と最小公倍数の計算

最大公約数と最小公倍数の値を求めます。 行 6, 桁 4 までの計算ができると思います。 数は整数で、半角スペースで区切ってください。

  • 97
  • 0

要素の ブロック, インライン 判定テスト

getComputedStyle() 関数を利用した ブロックレベル要素、インライン要素判定 テスト プレーンテキスト取得テストはで、取得要素のブロック、インラインを見分ける方法がが分からず、 要素名を書き出して処理していました。 その後、判定方法を調べてみると、getComputedStyle 関数で判断する方法があるようです。 確認した範囲では、chrome, IE では、 br と span の値に違いはないようです。 Firefox では、 br と span の値に違いが見られました。 http://mathematics.namekuji.jp/script/displaycheck-a.html

  • 36
  • 0

プレーンテキスト取得テスト2

プレーンテキスト取得テスト2 タグを一通り並べてますけど処理できるのか分かりません。_(:3」∠)_ タグの前後、テキストの前後にある空白を処理できるようにしました。 確認した範囲では、table, のセル内の文字数が違うと表示がズレてしまいます。

  • 82
  • 0

指定した要素のプレーンテキスト取得

指定した要素のプレーンテキストを返す関数です。 ブラウザによって、 innerText プロパティが返してくる値が違うので、 innerText 関数 を作成してみました。 それぞれのブラウザで innerText の値を pre タグに読み込ませてみると、 chrome では、 innerHTML と同じ表示になり、 ie, firefox は、取得した要素によっては、改行位置がずれたりして表示されます。 chrome でも p タグでは、 padding, と margin の値を 0 に指定しておかないと、 p タグの上下に必要としない改行が挿入されてしまいます。 この関数は、返ってきた値を pre タグに出力した場合、 innerHTML の表示と同じになるように作成しました。 テスト不足かもしれません。ヽ(´ー`)ノ テキストエリアに、上記の要素を使用したタグを貼り付けて "変換" をクリックすると、 タグを、要素に流し込み、DOM ツリー化、その要素の innerText と innerHTML の値を表示します。 また、作成した関数が処理した innerText ( プレーンテキスト )の値を表示します。 div, p, span, #text, br の5つのタグしか処理できません。 _(:3」∠)_ http://mathematics.namekuji.jp/script/myinnertext-a.html

  • 54
  • 0

Skills

Hot tags

Categories

HTML / CSS / JavaScript