16

だから私はDOMを操作することを学んでいて、1つの興味深いことに気づきました。

name「。」を使用して要素の属性を設定したいとします。ドット表記：

element.name = "someName";
console.log(document.getElementsByName("someName")[0]); // returns "undefined"??

ただし、このdocument.setAttribute()方法を使用すると、正常に機能します。

element.setAttribute("name", "someName");
console.log(document.getElementsByName("someName")[0]); // returns the element like it should.

最初のケースでドット表記法が機能しない理由がわかりません。

なぜこれが起こるのですか？

4

6 に答える 6

19

私の推測では（要素タイプを指定しなかったため）、要素には通常name属性がないため、そのようなDOMプロパティを設定しても機能しません。

たとえば、要素にnameプロパティを設定すると機能します。inputに設定しdivません。

ただし、で動作しsetAttribute()ます。

jsFiddle。

于 2011-12-08T05:20:24.870 に答える
7

他のいくつかによって提供された答えを拡張するには...

属性'name'は、いくつかの特定のオブジェクトに対してのみ有効なDOMと見なされます。https://developer.mozilla.org/en-US/docs/DOM/element.nameによると、これらのオブジェクトは次のとおりです。

 <a>, <applet>, <button>, <form>, <frame>, <iframe>, <img>, <input>, 
 <map>, <meta>, <object>, <param>, <select>, and <textarea>

これらのオブジェクトの場合、name属性を設定、取得、および変更できますが、object.nameその他のDOMオブジェクトの場合、属性'name'はカスタム属性であり、HTML宣言を使用してSetAttribute()、またはHTML宣言に追加して作成する必要があります。作成したら、を使用してアクセスするか、例としてhttp://jsfiddle.net/radiotrib/yat72/1/setAttribute()を使用しgetAttribute()てその値を直接参照できますobject.attributes.name.value。ところで-ロード時のアラートボックスは意図的なものです-コードをチェックして理由を確認してください...

于 2013-03-24T16:50:14.470 に答える
3

（上記の投稿の一部を個別に説明しようとすると、すでに-veレーティングになっているため、その投稿への信念は低くなります。これをさらに改善するのに役立ちます。）

***property

element.nameを使用すると、既存のproperty名前付き「name」にアクセスするか、その値を設定します。

Example 1:
var div1 = document.getElementById("div1"); 
div1.textContent = "2";

***attribute

ただし、、を使用してelement.setAttribute('name','someName')いる間は、実際にはattribute「名前」という名前を設定しています。この属性は、既存のプロパティにすることも、必要なカスタムプロパティにすることもできます。

Example 2:
var h1 = document.getElementById("H1"); 
h1.setAttribute("class", "democlass");

Example 3:
var d = document.getElementById("d1"); 
d.setAttribute("name1", "value1");
于 2015-06-05T11:58:42.227 に答える
1

element.nameを使用すると、プロパティにアクセスするか、「name」という名前のプロパティを作成してその値を設定します。

于 2018-01-28T19:04:55.870 に答える
0

element.nameを使用すると、プロパティにアクセスするか、「name」という名前のプロパティを作成してその値を設定します。

しかし、

element.setAttribute（'name'、'someName'）を使用している間、実際には属性'name'を設定しています。

IE8以下では、プロパティと属性が同じように扱われます。バグはIE9以降で修正されています。
Safari、FireFox、Chromeは、プロパティと属性を異なる方法で処理します。

ただし、必要に応じて、いつでも選択した新しいプロパティを作成できます。

于 2013-03-22T12:20:27.010 に答える
0 
<head>
<script>
function test($count) {
document.getElementById("test1").setAttribute("name","file-upload_" + $count);
}
</script>
</head>
<body>

<p>some content</p>
<input id="test1" type="file" name="file-upload" id="file-upload" />
<p>some other content</p>
<script>test(1);</script>
</body>
于 2013-09-30T01:54:10.150 に答える