Javascript HTML标签名称而不是ID？

我正在制作一个网站，在那里我创建了许多标签，这些标签被分配到这里的输出中

在文章末尾使用fiddle链接

马德考兹

毛茸茸的独角兽

蓝色杂种


JS素材：
var团队=$（“.team”）；
对于（i=0；i使用
getAttribute
：

teams[i].getAttribute('name')

为什么不使用多个类：

<label class='team ally'>Madcowz</label><BR>
<label class='team ally'>Fluffy Unicorns</label><BR>
<label class='team enemy'>Blue bastards</label><BR><BR>

Madcowz

毛茸茸的独角兽

蓝色杂种



而JS：

<script>
var outEl = document.getElementById('printSomeOutputHere');
var teams = $(".team");
for(i=0; i<teams.length; i++)
{
    outEl.innerHTML +=
        (teams[i].hasClass('ally')? 'ally':'enemy') + ": " +
        teams[i].textContent;
}
</script>


var outEl=document.getElementById（'printSomeOutputHere'）；
var团队=$（“.team”）；
对于（i=0；iFrom:

[名称属性]仅适用于以下元素：，，，，，，，，，。

因为您使用的是jQuery，所以我会使用如下内容：

for(var t in teams){
    $('#printSomeOutputHere').get(0).innerHTML += 
        teams[t].getAttribute("name") 
        + ": " 
        + teams[t].text() 
        + "<BR />";
}

for（团队中的变量t）{
$（'#printSomeOutputHere'）.get（0）.innerHTML+=
团队[t].getAttribute（“名称”）
+ ": " 
+团队[t].text（）
+“
”；
}
有几点：

您似乎知道
name
不是
label
元素的有效属性。因此不要使用它，而是使用
数据名

您错误地使用了
标签
元素。有两种方法可以使用
标签
：A）将
输入
，
选择
，或
文本区域
放在它里面（
请不要垃圾邮件
），或使用
for
属性将其与文档中其他位置的元素之一关联（
请不要垃圾邮件…
）。使用
标签
，其中没有控件，也没有
for
是毫无意义的；只需使用
span

你在一个地方使用jQuery，但在其他地方没有。我建议如果你想在你的页面上有一个库，最好充分利用它。在这种情况下，要访问属性，你可以使用
$（teams[I]）.attr（“name”）
或者更好的，
$（teams[I]）.attr（“data name”）
如果你使用的是
data-*
属性（参见上面的第1条）（有些人可能会告诉你使用<代码>数据< /代码>来访问属性；不要，这不是它的用途。但是你可以考虑看看它的用途和它是否对你有帮助。）< /P> 
.innerHTML+=“内容”是一种反模式。它使浏览器循环在你正在做的元素中的所有元素中建立一个字符串，然后用它在右边追加字符串，然后解析结果，并删除元素中的所有现有元素，并用解析的结果替换它们。，“内容”）

您不需要在任何地方声明
i
，这意味着您的代码会受到攻击。声明
i
，或使用不需要索引计数器的任何一种

您的输出将很难阅读，建议将其分解（可能每个团队有一个div？）

textContent
在跨浏览器时不可靠，有些浏览器使用
innerText
（它们之间的空格处理方式也有差异）。因为您使用的是jQuery，所以请使用
text

…但是是的，如果您使用
.getAttribute（“name”）
而不是
.name
，则代码可以工作。浏览器甚至可以通过
getAttribute
访问无效属性。它们只是不必为它们创建反射属性

下面是一个版本，上面应用了各种注释：


var输出=$（“#printSomeOutputHere”）；
$（“.team”）。每个（函数（）{
var$this=$（this）；
output.append（“+$this.attr（“数据名”）+”：“+$this.text（）+”）；
})；
Madcowz

毛茸茸的独角兽

蓝色杂种


JS素材：
使用数据属性？数据名称？您想要的是jQuery解决方案还是纯javascript解决方案？“在文章末尾使用fiddle链接”如果您不想让人们在问题中使用堆栈片段，请将问题中的代码作为代码块（而不是堆栈片段）。但实际上，现在使用堆栈片段比使用小提琴要好。
teams[i].getAttribute（“name”）
@Mouser：“只有当它们以
data-
开头时，才允许创建自定义属性”。执行此操作，但也要执行Shan Robertson提到的操作，将所有name实例重命名为data name，然后执行teams[i].getAttribute（“数据名”）标签标签没有名称属性。非常彻底的帖子。我更喜欢你的答案而不是我的。既然jQuery是混合的，那么使用而不是
attr
？@pwdst:Doh！复制和粘贴错误，旨在修复这些错误。谢谢，现在修复了。@steveax：因为正如我在回答中所说的，
数据
不是用于这个问题的。如果你只是访问g属性，而不是实际使用
数据
管理的单独数据缓存，使用
数据
是不合适的（有时会产生误导，因为它不会回写到属性）.因为我的例子不是我正在研究的真实事物，实际上它只显示了我的问题，但在我的项目中，制作100多个不同类的想法并不符合我的口味（我认为ID应该总是多于类，而不是相反）我明白你的意思，但我认为CSS类与OOP类不同，也就是说，你不会在每个类中引入额外的“实体”。@BartłomiejSobieszek：我不一定支持ptrk的“使用类来实现这一点”，但“我认为总应该有比类更多的ID，而不是相反的方式”我相信：“
getAttribute
确实有效，但是上面的代码将失败，因为
for in
。它将遍历jQuery对象
团队的每个公共属性，包括（从jQuery 1.11.1开始）149索引以外的属性，如
length
和
ajaxStart
和
bind
等属性