Html/Javascript：HTMLコントロールに属性を追加する

必要：通常のHTMLコントロールに有効なタグ/属性/プロパティを追加する方法を見つける。Html/Javascript：HTMLコントロールに属性を追加する

私が持っているものは、divを表示または非表示にするリンクにclickイベントを追加するjavascript/jqueryです。これは、$（document）.readyと匿名メソッドを使用して、ページロード時にonClickというメソッドを作成するというものです。クリックすると、divがテキストとともに表示されます。これは、ページの読み込み時にテキストを設定できるようにするために、テキストを設定する方法がわからないことを除いて、すべてうまくいきました。、IEでのみ動作XHTML（MEH）有効でないほか今

$(document).ready 
(
    function() 
    { 
    $("..showItLink").click 
    (
     function(event) 
     { 
     var containerPosition; 
     var createdDiv; 

     //see if the div already exists 
     createdDiv = $(this).children(".postComment"); 

     if (createdDiv.length == 0) 
     { 
      //This is where the attribute is used so that the CreateDiv 
      //method can take the textToShow and fill the div's innerText 
      //with it     V V V V V V 
      createdDiv = CreateDiv(this.textToShow, "postComment"); 
      $(this).append(createdDiv); 
      $(this).children(".postComment").hide(); 
     } 

     $(createdDiv).toggle(); 
     event.preventDefault(); 
     } 
    ); 
    } 
);

：私はこれを行うことができるように

<a href="..." class="showItLink" textToShow="This is the text to show">HI</a>

：私が好きなことのようなものです。 Firefoxはただ存在しないと言います。（this.textToShow）私はrelやrevのようなものを使うことができますが、それはちょっとハッキリしているようです。私はこれを行うための有効な方法があるかどうか疑問に思っていた。と組み合わせる

comment = $(".showItLink").attr("comment"); 
... 
createdDiv = CreateDiv(comment, "postComment");

以下の答えから

ソリューション：

<a href="http://www.theironical.com" class="showItLink" comment="hihihi" >HI</a>

出典

2009-03-13 Programmin Tool

JQueryを使用している場合は、.attr（）で属性を取得して設定するだけです。

取得：this.attr（ "textToShow"）

セット：this.attr（ "textToShow"、値）

出典

2009-03-13 20:13:12

これはうまく動作するように見えます。まだ私はxhtmlの有効性を破る必要があることを意味しますが、私はまだ泣くつもりはないと確信しています。 –

私は個人的にXHTMLから離れるでしょう。私はHTML 5が出るまでHTML 4に戻った。 –

これはXMLとは関係ありません.XHTMLの場合と同じように、 'textToShow'属性は従来のHTMLではまったく無効です。 – bobince

この種のものを行うための最善の方法は、他の要素のテキストを非表示にし、その要素を切り替えることです。「要素」は、追加する要素であり、どこにHTMLコントロールに属性を追加する方法は element.setAttribute（「attributeNameの」、「属性値」を参照）を使用している

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
    <head> 
     <title>clear test</title> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
       $("#show-it").click(function() { 
        $("#message").toggle(); 
       }); 
      }); 
     </script> 
    </head> 
    <body> 
     <div> 
      <a id="show-it" href="javascript:void(0);">show it</a> 
      <div id="message" style="display:none;"> hidden message</div> 
      hello world 
     </div> 
    </body> 
</html>

出典

2009-03-13 20:02:42

：このような何かを試してみてくださいに属性。

属性を取得するには、getAttribute（ "attributeName"）;を使用します。

出典

2009-03-13 20:03:07

カスタムはまだされながら、HTML要素に属性を追加することで逃げることができません有効です。現在のブラウザでは一般的に動作しますが、ブラウザによってHTMLまたはJavaScriptのプロパティとして（現在または将来）使用されている名前を選択した場合、クラッシュにより動作しなくなります。

HTML5は、有効な拡張メカニズムとして「data-」で始まる名前の属性を提案しています。また、XHTMLの名前空間要素を考慮することもできます。これは技術的には "有効なXHTML"ではありませんが、少なくとも衝突からは安全です。

<のhref = "..." クラス= "showItLink" textToShow = HI>私は、この特定の目的のための 'タイトル' 属性を使用することをお勧め

"これは表示するテキストです" 。

出典

2009-03-14 01:32:14 bobince

あなたはclass = "showToLink"のような意味ですか？xmlns：comment = "これは表示するテキストですか？"タイトルの問題は、何かのためにまだ何かを使用しているということです。ホバーに現れていることは言及していません。 –

'namespaced'とはのようにmynsがルート要素で宣言されているため、DTDを拡張して有効なものにする必要がありますまだ '有効なXHTML'ではない）。 – bobince

ホバー上に表示するのはまさに私がその例題のために「タイトル」を選んだ理由です。あなたがマウスを動かすとリンクが行う妥当な振る舞いで、検索エンジンが見ることのできるテキストを置くことができます。明らかに、「タイトル」は、すべてのタイプのバリュー・パス・ツー・スクリプトのブランケット・ソリューションではありません。 – bobince

textToShow属性がexpandoプロパティの場合、this.textToShowは未定義を返しませんが、カスタム属性であるため、jQueryのthisを使用する必要があります。attr（ "textToShow"）または標準のDOM this.getAttribute（ "textToShow"）です。

出典

2009-03-14 02:37:32 nickytonline

Html/Javascript：HTMLコントロールに属性を追加する

答えて

関連する問題