hrefとdata-hrefの差異がhtmlのアンカータグである

Question

hrefとdata-href属性の相違点は、<a></a>タグのhtmlとは何ですか？ 私の現在のコードは下に書かれている：

<a id="sign_in_with_facebook" href="verify_phone_process_1.html" class="btn btn-default bubbla-btn">Sign In with Facebook</a> 

と私はページをverify_phone_process_1.htmlするリダイレクトいない

<a id="sign_in_with_facebook" data-href="verify_phone_process_1.html" class="btn btn-default bubbla-btn">Sign In with Facebook</a> 

にそれを変更していたとき。

Answer 1

htmlタグのhref属性とdata-href属性の違いは何ですか？後者は自分自身で何もしないのに対し、それはちょうど任意の名前だ - （それはことを実現属性としてが指定されているので）、前者は実際に含まれるすべての機能/ UIで、どこかにリンクされることを

任意の値を持つカスタムデータ属性。

---

編集：は、カスタムデータのいくつかのより多くの情報が属性：

https://developer.mozilla.org/en/docs/Web/Guide/HTML/Using_data_attributes

http://www.w3.org/TR/html5/dom.html#custom-data-attribute

Answer 2

グローバルHTML データ - *属性をする準備（カスタムデータを格納するために使用されていますCSSとJavascriptによって呼び出される）。 *は任意の字幕で置換できるワイルドカードです。次のスニペットで

CSSはJavascriptがその背景に色を適用するためにdata-color属性に格納されたデータを使用しながら、テキスト:afterのdivのコンテンツを追加するdata-appendに格納されたデータを使用しています：

var zzz = document.getElementsByTagName("div")[0].getAttribute("data-color"); 
 
var yyy = document.getElementsByTagName("div")[1].getAttribute("data-color"); 
 

 
document.getElementsByTagName("div")[0].style.background = zzz; 
 
document.getElementsByTagName("div")[1].style.background = yyy;

div::after { 
 
    content: attr(data-append); 
 
}

<div data-append="_SUCCESS_" data-color="lawngreen"></div> 
 
<div data-append="_FAILURE_" data-color="tomato"></div>