数学、電気の勉強始めました!プログラムにも挑戦しています!|ω・)ノ

ねごとめも背景

# ねごとめも

# カウンター

# プロフィール

negotoy

Author:negotoy
電気の勉強始めました!
テキストエディタを使ってプログラミングに挑戦中。
fc2 ブログに公開しているテンプレート等は、自由にカスタマイズして、ご活用ください。
プログラム実行の前に必ずコードの確認をお願いします。

# 最新記事

# カレンダー

04 | 2017/05 | 06
- 1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31 - - -

# スポンサードリンク

テキスト内指定文字列 CSS クラス名一括指定ツール作成しました。



createHtmlText 関数 では、後からの要素追加ができなかったので、
任意のタイミングで要素追加が出来るように、HtmlText として、クラス化しました。
createHtmlText 関数のクラス化 → { HTML テキスト(タグ)一括作成 : HtmlText クラス }

Array 配列を利用して、HTML テキスト(タグ)を一括作成する createHtmlText 関数書きました。
この関数から返ってきた戻り値を、ドキュメントに反映させれば、
前回作成した、この関数と → Array 配列を利用した DOM 要素の一括作成 と、結果は同じになります。
同じと言い切れるほど、テストは、やってなかったりします。_(:3」∠)_
テキスト版では、DOM 版で使えた、 document.createDocumentFragment(); が使えないので、
場合によっては、不必要な要素が一つ増えたりします。
処理速度を比べてみましたが、テストした範囲では、結果に大きな差は見られなかったです。
わざわざ配列を作って処理するより、普通にタグを書いたほうが効率がいいと思います。(*‘ω‘ *)

プログラム、コードは、こちらのサイトで公開しています。
{ 配列を利用した HTML テキスト(タグ)一括作成 : javascript }




javascript, html, css のソースコードをハイライト表示する関数書きました。
ちなみに、3回書き直しています。
一回目、二回目のプログラムは激重でした。
今回ので、それほどストレス無く表示出来るようになりました。
正規表現、配列での処理を少なくしたので、
以前のよりは動作が軽くなったと思います。


正規表現、配列処理を多用したソースコードハイライトプログラムの処理時間

正規表現、配列処理を多用したソースコードハイライトプログラムの処理時間



正規表現、配列処理を減らしたソースコードハイライトプログラムの処理時間

正規表現、配列処理を減らしたソースコードハイライト関数の処理時間

動作は、いいのですが、肝心のハイライト処理の方は、かなり あやしい です。(*'ω' *)
プログラムはこちらのサイトでも公開しています。
{ ソースコードのハイライト表示 ( β ) : javascript }


# スポンサードリンク