web-dev-qa-db-ja.com

「この時点で要素divで許可されていない属性名」

理解できないW3V検証エラーが表示されます。

行31、列61:属性nameは、この時点では要素divで許可されていません。

それがこの行です:

<div name="message" class="jGrowl bottom-right errorGrowl"></div>

完全なHTML:

<!DOCTYPE html>
<html>
    <head>
        <title>jGrowl</title>

        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>     
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>

        <script type="text/javascript" src="data/awo-jgrowl.js"></script>
        <script type="text/javascript" src="data/shortcut.js"></script>

        <link rel="stylesheet" type="text/css" href="data/awo-jgrowl.css">

        <script type="text/javascript">
            $(document).ready(function() {
                $('div[name=message]').awomsg('Input message', {sticky: true});
            });

            shortcut.add("m",function() {
                $('div[name=message]').awomsg('Input message', {sticky: true});
            });

            shortcut.add("h",function() {
                alert('ur doin it wrong');
            });
        </script>

    </head>
    <body>
        <div name="message" class="jGrowl bottom-right errorGrowl"></div>
    </body> 
</html>
25
Thew

エラーメッセージは、一目瞭然のようです。 nameタグにdiv属性を持つことはできません。したがって、コードは次のようになります。

<div id="message" class="jGrowl bottom-right errorGrowl"></div>

次に、IDセレクターを使用します。

$('div#message')...
21
Darin Dimitrov

私はいくつかのエントリを見つけました:

マークアップ検証エラー:「この時点では要素に属性名を使用できません」エラー#HTML5

カスタム属性を定義する場合に備えて、属性に「data-」を追加する必要があります。

したがって、この場合、名前はdata-name=""になります。

また、'div[data-name="value"]'で参照できます。

22
Ross

Div要素にはname属性はありません。

一意に識別する場合は、idを使用します。

グループのメンバーとしてマークする場合は、classを使用します。

(非推奨ではない)name属性を使用できる唯一の場所は、フォームコントロール(inputselecttextareaおよびbutton)。

16
Quentin

これは遅い応答ですが、このページは検索で表示されたばかりです。

Name属性は特定の要素では許可されておらず、必要のない形式では特別な意味を持ちますが、「data-」で始まる属性名は独自の目的で使用することが許容されるため、「data-name次のような属性:

<div data-name="message" class="jGrowl bottom-right errorGrowl"></div>

次のように書くことができます:

$('[data-name="message"]').text("Here is a new message!");

それ以外の場合は、jQueryを介してdivを操作します。

データ属性の使用には、フロントエンドのデザイナーがCSSの目的でIDとクラス名を使用して実行していることと競合する可能性が低いという長所があります。

私たちのオフィスでは、IDとクラスはCSS用に予約されていることを理解しており、JavaScript開発者はそれらを放っておかなければなりません。逆に、フロントエンドデザイナーは、データ属性を混乱させない限り、ID、クラス、またはほとんどのものの要素タイプを変更することを歓迎します。

8
Tom Boutell

name属性は、DIV要素の仕様の一部ではありません。 nameは、一般的に、フォーム要素でのみ有効です。

参照: http://www.w3schools.com/tags/tag_div.asp

1
Chris Baker