1

カスタムタグを定義して使用しても大丈夫ですか?(これは将来のhtmlタグと競合しません)-outerHTMLを変更してそれらを置き換え/レンダリングしている間??

以下のデモを作成しましたが、正常に動作しているようです

    <!DOCTYPE HTML>
    <html lang = "en-US">
    <頭>
        <script type = "text / javascript" src = "jquery.min.js"> </ script>
    </ head>

    <本体>

    <div id = "customtags">
        <c-TextField name = "Username"> </ c-TextField> <br/>
        <c-NameField name = "name" id = "c-NameField"> </ c-NameField> <br/>
        <c-TextArea name = "description"> </ c-TextArea> <br/>
        <blahblah ct = "d"> </ blahblah>
    </ div>
    </ body>


    <スクリプト>

    /*cspaを実際のhtmlに置き換えるための以下のコード--woaahそれはうまく機能します*/    
        関数ReplaceCustomTags(){
            //cspaはランダムな用語です-実際には何も意味しません
            var grs = $( "*");
            $ .each(grs、function(index、value){
                var tg = value.tagName.toLowerCase();
                if(tg.indexOf( "c-")== 0){
                    console.log(index);
                    console.log(value);
                    var obj = $(value);
                    var newhtml;
                    if(tg == "c-textfield"){
                        newhtml ='<input type = "text" value = "'+ obj.attr('name')+'"> </ input>';
                    } else if(tg == "c-namefield"){
                        newhtml ='<input type = "text" value = "FirstName"> </ input> <input type = "text" value = "LastName"> </ input>';
                    } else if(tg == "c-textarea"){
                        newhtml ='<textarea cols = "20" rows="3">モデルからの説明</textarea>';
                    }
                    obj.context.outerHTML = newhtml;
                }


                z = obj;
            });
        }

        if(typeof(console)=='undefined' || console == null){console = {}; console.log = function(){}}

        $(document).ready(ReplaceCustomTags);
    </ script>
    </ html>


質問の更新:

これについてもう少し説明させてください。ブラウザでJavaScriptが有効になっていると想定してください。つまり、アプリケーションはjavascriptなしで実行されることは想定されていません。

カスタム属性を使用して、指定されたタグのカスタム動作を定義するライブラリを見てきました。たとえば、Angular.jsはカスタム属性を多用します。(カスタムタグの例もあります)。私の質問は技術戦略の観点からではありませんが、なぜそれがコードのスケーラビリティ/保守性に戦略的に問題を引き起こすのか理解できません。

私にとって、<ns:contact .....>のようなコードは、<div custom_type ="contact"....>のようなコードよりも読みやすくなっています。唯一の違いは、カスタムタグは無視されてレンダリングされないのに対し、divタイプはブラウザによってレンダリングされることです。

Angular.jsは、カスタムタグの例(ペイン/タブ)を示しています。上記の例では、outerHTMLを使用してこれらのカスタムタグを置き換えていますが、ライブラリにそのようなコードは表示されていませんが、outerHTMLを使用してカスタムタグを置き換えることで、近視眼的で間違ったことをしていますか?

4

2 に答える 2

0

それはうまくいくかもしれませんが、おそらく良い考えではありません。スクリーン リーダーと検索エンジンは、JavaScript を解釈しない可能性があるため、ページを読み取るのが困難または不可能な場合があります。要点はわかりますが、このテンプレートを使用して開発し、サーバーに配置する前に HTML に「焼き付ける」方がおそらく良いでしょう。

于 2013-01-27T21:56:27.673 に答える
0

あなたがこれをやりたい理由が思い浮かびません。

すべての一般的な慣行や慣習を無視した他の誰かによって書かれたプロジェクトに取り組まなければならないとしたらどう思いますか? なぜ彼らが特定の方法で何かをしたのかを知るために、彼らが会社にいなくなったらどうなるでしょうか?

まったく機能させるために JavaScript を使用する必要があるという事実は、非常に危険な信号です。よほどの理由がない限り、既存のタグを使用してください。半年後、なぜそのようなことをしたのか覚えていますか?

于 2013-01-27T22:00:44.610 に答える