1

次のコードのように、現在jqueryを使用してidの値を取得しています。

<ul class="trf noborder" data-id="6581">
</ul> 

var ID = $("ul.trf").data('id');

純粋なJavaScriptを使用してこれを行うにはどうすればよいですか？スパンクラスなどを追加する必要がありますか？

Ty

4

4 に答える 4

2

純粋なJavaScriptで使用 element.getAttribute('attribute_name') して、任意のデータ属性の値の値を取得できます。

例はここにあります： ここをクリック

于 2012-07-29T11:57:24.323 に答える
2

ニーズと期待するパフォーマンスの種類に応じて、純粋なJavaScriptを使用してこれを行う方法はいくつかあります。IDを使用する1つの方法は次のとおりです。

<ul class="trf noborder" data-id="6581" id="myDiv">
</ul> 

<script type="text/javascript">
    var id = document.getElementById("myDiv").getAttribute("data-id");
</script>

または、IDなしで特定のULをターゲットにする場合は、これを試すことができます

<ul class="trf noborder" data-id="6581">
</ul> 

<script type="text/javascript">
    var id = document.getElementsByTagName("ul")[0].getAttribute("data-id");
</script>

ただし、正しいインデックスを使用していることを確認する必要があります。ここでは、ページの最初のULが取得されます。別のコンテナでラップすることもできます。

<div id="container">
    <ul class="trf noborder" data-id="6581"></ul> 
</div>

<script type="text/javascript">
     var container = document.getElementById("container");
     var id = container.getElementsByTagName("ul")[0].getAttribute("data-id");
</script>

そして、そのコンテナ内の最初のULを使用します。または、このように行う場合は3番目：

 var id = container.getElementsByTagName("ul")[2].getAttribute("data-id");

これは配列インデックスに基づいています。この場合は2です（0、1、2 = 3番目の要素）

jQueryは必要ないが、ライブラリを使用しても構わないと思っている場合は、優れたセレクターエンジン（実際にはjQueryで使用されている）であるhttp://sizzlejs.comを参照してください。Sizzleを使用すると、次のように実行できます。

var id = Sizzle("ul[data-id]")[0].getAttribute("data-id");

data-id属性が指定されているページの最初のULのdata-idを取得します。

于 2012-07-29T11:58:48.007 に答える
1

getAttribute関数で属性を読み取ることができます。ただし、getElementById関数またはgetElementsByTagname関数を呼び出して、要素自体を収集する必要があります。

于 2012-07-29T11:57:38.637 に答える
1 
getData: function(el, attr) {
  attr = 'data-' + attr;
  var result = (el.getAttribute && el.getAttribute(attr)) || null;

  if(!result) {
    var attrs = el.attributes;
    var length = attrs.length;

    for(var i = 0; i < length; i++)
      if(attrs[i].nodeName === attr)
        result = attrs[i].nodeValue;
  }

  return result;
}

var el = document.getElementsByClassName('trf')[0];
var id = getData(el, 'id');
于 2012-07-29T12:04:42.857 に答える