0

次のような HTML スニペットを言います。

<div a_example = "x" b_example = "y" class = "z"></div>

Javascriptでa_exampleとb_exampleの対応するプロパティを取得する適切な方法は何ですか?

xpathは仕事をすることができますか?

4

6 に答える 6

3

使用getAttribute:

var elem = document.getElementsByClassName("z")[0],
    a = elem.getAttribute("a_example");

これが実際の例です。

しかし、すでに述べたように、実際には HTML5data-*属性を使用する必要があります。そうしないと、マークアップが無効になります。

于 2012-11-06T10:45:47.730 に答える
2

すべての属性を DOM 要素の名前付きプロパティとして追加するブラウザもあれば、標準属性のみを追加するブラウザもあります。どちらの場合も、 を使用して非標準の属性を取得できますがgetAttribute、そのようなスキームはお勧めしません。

標準の属性と DOM プロパティを使用し、必要な場合にのみ getAttribute を使用するのが一般的です。これは、さまざまなブラウザーで一貫して実装されていないためです。

于 2012-11-06T10:47:26.143 に答える
1

HTML5 のデータ属性を確認する必要があります。役に立つ記事は次のとおりです: http://html5doctor.com/html5-custom-data-attributes/

タグからデータ属性を読み取るのは非常に簡単で、古いブラウザーではフォールバックを利用できます。記事の例：

<div id="sunflower" data-leaves="47" data-plant-height="2.4m"></div>

<script>
// 'Getting' data-attributes using dataset 
var plant = document.getElementById('sunflower');
var leaves = plant.dataset.leaves; // leaves = 47;
</script>
于 2012-11-06T10:43:59.243 に答える
0

データ属性と非標準属性を追加するためのより良い方法を検討する必要があることに同意しますが、これは質問に対する「生の」回答ですが、これを普遍的にサポートされている (または推奨する) とは見なしません。

    alert(document.getElementsByTagName('div')[0].getAttribute('b_example'));
于 2012-11-06T10:47:55.220 に答える
0 
element.getAttribute(attributename)

これはうまくいくはずです。

于 2012-11-06T10:45:55.270 に答える
0

jQuery を使用している場合は、次のように簡単に言えます。

HTML

<div id="testDiv" a_example = "x" b_example = "y" class = "z"></div>

Javascript:

var attr1 = $('#testDiv').attr('a_example');
于 2012-11-06T10:44:36.733 に答える