プロパティ宣言をスマートに書くには？

質問

• コードをスマートにするため、Questionを一度だけ書くアルゴリズムに変更したい。
• 現在のコード(1)では、Questionのコードを複数回書く必要があるため、量が多くなってしまう。
• 目的は、Questionのコードを一度だけ書けるようにすることで、コードをスマートにすること。

回答No.4

babu_baboo

#1です。
＞同じ状況に立った場合にどのように対策

専門家でもないし、どうこう言える立場でもございません。
お役にたてそうもありません。ごめんなさい。

どのような関数をどう定義するかもわからないのですから
答えようがありません。
ただ回答者側のコードを見ていて思うのですが、
個々の要素にイベントを記述する方が、圧倒的に多いようです。
TAG indexなどで記述されたコードを見て勉強している者からすると
なんだかなぁ～と思うことが多々あります。（腕は未熟者ですが）

csvなんてキーワードがあるくらいなので、規則性のある表？（データ）
なのでしょうか？
たとえば個別のセルにイベントを貼り付けなくても、
tableにonclickのイベントを１つくっつけておけば、どのセルを
クリックしたか調べることはできます。
そこからその列の処理に移れば良しと考えています

自分は、結果をもとめられる立場ではないので、いきなり
数行ですげーことをして仕事に役立てる必要はありません。
むしろ、原理というか基礎というかそのへんを学びたいのです。

自分からは、XPathなんて遠い所にあります。^^;
お～キャラが消えていた。

ばぶぅ～。

お礼

2度にわたるアドバイスありがとうございました。
babu_babooさんはコードを必ず掲載する回答者さんと認識しており、いくつか参考にさせていただいています。

補足

> 個々の要素にイベントを記述する方が、圧倒的に多いようです。
えっと…、そんなに多いでしょうか？
現時点で8件の回答をしていますが、イベントを定義したコードを掲載したのは qa4928371 のみだと認識しています。
何か勘違いしているのでしょうか…。

ちなみに、qa4928371に関しては質問者さんにわかりやすいようにあえてHTML埋め込み型の書き方をしています。
# 綺麗なコードは書けるにこしたことはないのですが、質問者さんに伝える場合においては必ずしも必要ではないと考えています。
# 質問者さんの知っているレガシーな方法でコードを書いた方が伝わることもありますし、
# 例外処理までしっかり書いた長いコードよりも、シンプルな短いコードの方が伝わりやすいこともあります。ケースバイケースだと思います。
きちんと清書したら、node.onclick = function(){ ... }; でしょうか。
できることならイベントリスナを使いたいところですが、IE未対応なので仕方なく。
addEventListenerをオーバーロードするやり方もあるようですが、イベント実行順に癖があるようなので採用していません。

> csvなんてキーワードがあるくらいなので、規則性のある表？(データ)なのでしょうか？
おおざっぱに言ってしまえば、DOMで操作する要素ノードを返すメソッド、と思っていただければイメージできるかと思います。

var xpath = 'p#Test/strong[@title="test"][text()="It is a test."]';
document.body.appendChild($xQuery(xpath));

と

var p = document.createElement('p');
p.id='Test';
var strong = document.createElement('strong');
strong.appendChild(document.createTextNode('It is a test.'));
strong.title='test';
p.appendChild(strong);
document.body.appendChild(p);

は等価です。(IDセレクタは本来XPathではないですが、短い記述量が魅力的だったので採用しました)
階層の深い要素ノード、属性の多い要素ノードを短い記述で宣言できるのが最大の特徴です。

csv2array はCSVを2次元配列に変換して返します。
返ってきた配列を操作した上で array2tableNode で要素ノードに変換し、appendChildなどでページに追加することができます。
ちなみに array2tableNode でもXPathを利用していて、無指定だと単純なtableを。
"table#chat\ncaption[text()='簡易チャット']" を指定すると、<table ="Chat">、一行目がth、<caption>簡易チャット</caption> なtable要素ノードを生成します。

onclickですが、現在作成中のコードには全くありません。
基本的にはDOMで操作すればいいと考えており、長くなりがちなコードをライブラリで短くする事を目指しています。

あと2,3機能を実装すれば、公開できる形になる予定です。
おそらく1週間。順調にいけば今夜にでも公開できると思いますので、もし目にとまって魅力的に感じましたらお試しください。