![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?8acaa2e)
No.5ベストアンサー
- 回答日時:
No4です。
なんだか、意味が通じていないようで、気持ちが悪いので…
>今回私が知りたいと思ったのが、まさにそのルールを
>定めるための方法のことです
ルールは「やりたいこと」を知っている質問者様にしか作れません。
No4で書いたのは、ルールに応じた構造でマークアップしておけば、おのずとそのルールによって要素を判別できるのではないかという意味です。
ごく簡単な例で言えば、画像とキャプションの対がたくさんあるとして、レイアウト上から画像のところに文字をいれたくないし、キャプションのところに画像を入れたくないということが発生したとします。
ランダムにある(何を入れてもいい)ボックスに、識別子をつけてどちらかにわけて欲しいという要求はまずないでしょう。それなら、判別なんてする必要もなくどちらを入れてもかまわないのですから…
仮に(↑)の例で
<div></div> (画像用)
<div></div> (テキスト用)
のように見分けのつきにくいマークアップがしてあったとしても、識別子などは不要で、奇数番目と偶数番目ということで識別が可能だと思われます。
なぜかといえば、「対になっている」という目的からのルールを応用しているからで、HTML上の属性や目印(idやclass)がルールになっているわけではないからです。
また、これに表示の指定するために、<div class="image"><img ~></div><div class="text">text</div>などとすることを考え始めるのであれば、
<div>
<img ~>
<span>text</span>
</div>
とでも想定しておいた方がよほどましでしょう。
(<div>~</div>は<li>~</li>なのかも知れない)
中身より先にマークアップが存在するなんてことはあり得ないので、記述する内容があって初めてそれに対応するマークアップや構造が決まってくるはずです。(実際には、複雑なので構造だけで全てを識別するわけにはいかないでしょうけれど…)
というわけで、ルールを定めることができるのは、目的(内容)を知っている質問者様だけということです。
回答ありがとうございます
すみません、私の勘違いの部分も多かったです・・・
今までの考え方を少し変えると私の仕様を実現できそうです
マークアップ言語に触れて日が浅いので、どうしても力づくでやろうとしてしまうこともあり、よく仕組みを理解しないままに進めていた結果がこうなってしまったのだと思います
大変勉強になりました
No.8
- 回答日時:
後出しになってしまいましたが、、、というか思い出したので。
No.6、7の補足として、、、
HTMLの文法違反は絶対禁止という意見も少なからずあります。
また、JavaScriptでdocument.write('<div color="">')としたり、
document.getElementsByTagName('div')[0].setAttribute('color', '')なら
HTMLの文法チェッカー(スクリプトの中身までは見ないので)をパスするから大丈夫、という意見もあります。
Googleなどは独自仕様としてrel属性にNOFOLLOWなどを規定していますし、
(HTML4/5/XHTMLの文法上は、relに使用できる言葉はINDEXやBOOKMARKなど、指定されたものだけです。)
このような独自仕様はmicroformatsと呼ばれています。
http://microformats.org/wiki/Main_Page-ja
(microformatsは私には複雑すぎてよくわかりません。。。)
私自身の意見としては、作法としてはあまり好ましくはないと思います。
そのため、タグ属性を追加するのではなく、クロージャ、またはclass属性やrelの内容など、規定された属性で判断しています。
独自仕様を作るなら、他の方が公表している内容と違う内容にして置いた方が良いと思います。
(自分用のプレフィクスを付けて、<div taloo-color="">などとしたり。
HTML5にdata-というプレフィクスが定義されています。)
そうしないと、いきなりmicroformatsが実装されて、思ってた動作と違う動作になってしまう、と言うことも考えられますから。
(現在では、microformatsの動作はプラグインやアドオンによる物が多いと思います。)
ご参考まで。
回答ありがとうございます
microformats・・・wikiを見たのですが私には難しそうですね・・・
こういったものもあるのだと参考になりました
No.7
- 回答日時:
HTMLの拡張については、Spryフレームワークが参考になると思います。
http://labs.adobe.com/technologies/spry/home.html
<div spry:detailregion="">
などというspryネームスペースを使用して、データの表示やHTMLの再構築を行います。
本来はDOCTYPEを拡張しなければならないのですが、
ブラウザがDOCTYPEの拡張文法に対応していないため、DOCTYPEを拡張すると > という記号が表示されてしまいますので、
DOCTYPEを拡張せずに、文法違反のままspryネームスペースを使用するように、adobe社が指示しています。
No.6
- 回答日時:
> これを利用してHTMLファイルをjavascriptでパースする時の条件判別に利用しようと考えたのですが、こういった使い方はしてもよいものなのでしょうか?
文法違反に対する動作はブラウザ依存です。
ブラウザの種類やバージョンによっては使えるかもしれませんし、使えないかもしれません。
<div color="blue">が、今までは何の変化もなかったのに、突然青文字で表示されるようになるかもしれません。
今までJavaScriptで取得できていた物が、ブラウザのバージョンアップで突然取得できなくなるかもしれませんし、できるようになるかもしれません。
HTML4/HTML5/XHTML、DOM、HTML-DOM、JavaScript、ECMAScript、JScript、E4X等々、
さまざまな仕様が交錯していますから、
たとえばHTML4では「無視せよ」という仕様であっても、HTML-DOMで「有効にせよ」という仕様であれば、
ブラウザがどちらの仕様を優先するかでも違ってきます。
(たとえばelement.getAttribute('color')、element.colorでも違いが生じます)
それを踏まえた上で、
ブラウザ依存を吸収できるなら(または訪問者に使用するブラウザやバージョンを限定させるなら)かまわないと思います。
回答ありがとうございます
確かにwebブラウザのプログラミングだと、ブラウザの仕様がかなり効いてきますね
私もこれまでに何回か痛い目にあってきました・・・
ブラウザの仕様の違いだけでなく、そのバージョンアップにも気を配らないといけないのは大変だと思いました
No.4
- 回答日時:
実際のものが、どのようなものを想定しているのかわかりませんが…
HTMLの構造をうまく作ることで、なんら目印(idなど)がなくても要素を役割別に特定することは不可能ではないでしょう。
あるいは、他の方もおっしゃっていますが、同じ役割のものは表示方法が同じ場合が多いので、classをその手がかりとすることも十分に考えられます。よしんば、そうはうまくいかなくても、クラスは一意ではなく個々の要素が複数のクラスを持つことができるので、実質的にはこれで十分識別が可能だと思われます。(本来の用途からははずれるかも知れませんが)
あるいは、別の属性を使うにしても、すでに世の中で考えられている概念を利用しておくのも一法かと。
http://standards.mitsue.co.jp/resources/w3c/TR/2 …
http://msdn.microsoft.com/ja-jp/library/cc304102 …
>ボックスごとに文字が埋め込めるか画像が埋め込めるかの
>判別のために使えないか、と考えました
ボックスによって、入れられるものがなんらかの方法で決まっているのなら、そのルールで判別すればよいのではないでしょうか? 多分、文法的には画像もテキストも入れられるはずですから、そのルールというのは質問者様がなんらかの恣意によって作成なさったルールのはずで、気まぐれに決まっているものでもないでしょう。
まぁ、そんな面倒なことを言わなくても、例えば、画像用はdiv、テキスト用はspanなどとしておくだけでも簡単に判別可能にはなりますが…(表示方法はCSSで)
回答ありがとうございます
確かに、複数のクラスを持たせれば私の仕様を満たすことはできそうです
その分ソースが長くなってしまいそうですが、十分無視できるものだと思います
role属性というものがあるのは知りませんでした・・・
これはうまく扱えると便利そうですね
>ボックスによって、入れられるものがなんらかの方法で決まっているのなら、そのルールで判別すればよいのではないでしょうか?
すいません、私の書き方が悪かったです・・・
今回私が知りたいと思ったのが、まさにそのルールを定めるための方法のことです
どうにかして定めることができれば、判別できるだろう、と考えていました
>まぁ、そんな面倒なことを言わなくても、例えば、画像用はdiv、テキスト用はspanなどとしておくだけでも簡単に判別可能にはなりますが…(表示方法はCSSで)
最終的には、動画やフラッシュも埋め込めるようにできればと考えていたので、汎用的に使えるものを探していました
とは言え、色々とやり方はあるようですね
No.2
- 回答日時:
目的がよくわかりませんが、役にたたないか、とんでもなく複雑な
ものになるでしょう....
そもそも、何が正しいHTMLマークアップかというと、HTMLとか、XHTMLの
バージョンによっても異なります。
さらに、みんな、きちんとDOC宣言して、その仕様どおりに、
正しくHTMLマークアップしているとは限りません。
例えばHTML4.01 Strict で、各タグ(要素)で使える属性は、↓
http://www.w3.org/TR/1999/REC-html401-19991224/
http://www.w3.org/TR/DOM-Level-2-HTML/html.html# …
で調べなきゃなんないし、それだけでもたいへんです。
回答ありがとうございます
目的としては、cssで作ったボックスの中に後からjavascriptのinnerHTMLで文字や画像を埋め込むプログラムを作成していました
その時に、ボックスごとに文字が埋め込めるか画像が埋め込めるかの判別のために使えないか、と考えました
見直してみると、結構DOC宣言を忘れているプログラムがありました・・・
貼っていただいたリンクの方も参考にさせていただきます
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS HTMLタグのあるCSVファイルを利用する方法 4 2023/03/19 14:41
- CGI CGIで出力するhtmlの<!DOCTYPE html>等のタグは要りますか? 2 2023/02/05 21:26
- ヤフオク! ヤフオクの利用制限について 4 2023/08/07 23:17
- その他(ブログ) テレグラムをブログに埋め込むことはできますか? 1 2022/06/04 11:20
- WordPress(ワードプレス) ワードプレスで、投稿一覧ページにタグを表示する方法 投稿につけたタグを、記事一覧ページにもカテゴリと 1 2023/05/10 21:41
- HTML・CSS HTMLのdlとul どちらが正しいと思いますか 3 2023/02/23 11:20
- バッグ・財布 皮のバッグなのに持ち手が剥がれた? デパートでのセールでラルフローレンのバッグを購入しました。バッグ 4 2022/08/19 15:00
- 洗濯機・乾燥機 前回の質問の続きです。 購入したブラジャーを洗おうとしたのですが、タグを見てみると洗濯機使用不可の記 2 2022/09/29 22:32
- ノートパソコン 古いノートパソコンVostro 3500の電源アダプターについて 3 2022/10/07 13:58
- その他(ブラウザ) テキストの折り返しがないサイトの文字を折り返してPDF化したい 4 2022/12/02 09:49
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
【CSS】特定のリンクを含むaタ...
-
サイトにjQueryが使用されてい...
-
ページの左右の余白(枠外)に...
-
HTML CSSについて
-
CSSで背景画像をランダムに同画...
-
CSSに同じclass名がいっぱい‥。...
-
個別にリンクの色を変える方法
-
CSSのクラス名・ID名の指定でワ...
-
htmlの文字が縦書きになる
-
【ヒトの神秘】美男美女から何...
-
widthやheightの数値に単位(px...
-
含む含まないという概念自体の...
-
ページを開いているときのリン...
-
テーブルのセル間に余白が空い...
-
htmlのolやulなどlistにtitleや...
-
NからZへの全単射を具体的に構...
-
有限要素法
-
【マークアップ言語 複数画像中...
-
HTML5のfooterに見出しを付けて...
-
複数のボタンを等間隔に、かつ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
個別にリンクの色を変える方法
-
CSSのクラス名・ID名の指定でワ...
-
CSSに同じclass名がいっぱい‥。...
-
idの中のid指定
-
最近、HTMLのヘッダーをIDで定...
-
liリストタグの背景色に色がつ...
-
HTML要素のid/class名の長さに...
-
brにクラスをつけてcssでdispla...
-
透過背景を解除するにはどうす...
-
htmlのid属性って必要なの?
-
ページの左右の余白(枠外)に...
-
フロートのクリアについて
-
CSS, リンクの色を一部変えるに...
-
スタイルシートでデザイン
-
サイトにjQueryが使用されてい...
-
Bootstrap3でcontainerがずれる...
-
外部css定義したclassをht...
-
スタイルシートで、id属性の中...
-
CSSで、DIV#hogeという記述は何...
-
divの入れ子を多用してページを...
おすすめ情報