function authorNumbering() {
var authorDivs = document.getElementById('authorView').getElementsByTagName("div");
var labels = [];
var nameForLabels = ["Author 1", "Author 2", "Author 3", "Author 4", "Author 5", "Author 6", "Author 7"];
for (var i = 0; i < authorDivs.length; i++) {
var labelsFromDiv = authorDivs[i].getElementsByTagName("label");
for (var x = 0; x < labelsFromDiv.length; x++) {
if (!(typeof labelsFromDiv.item(x) === "undefined" || labelsFromDiv.item(x) == null)) {
labels[x] = labelsFromDiv.item(x);
}
}
labels[i].innerHTML = nameForLabels[i];
}
}
本质上,函数(或至少它在我脑中的作用)经过并从作者div中获取一堆标签。然后,我将标签(未定义或为空)保存到数组中。我现在希望能够更改标签,如上所示(x
)但由于某种原因,x
始终为0或1.我尝试了几件事,但我没有我认为我理解逻辑足以弄清楚它的正确性。 labels[]
在数组中也有重复项,如何在仍有两个循环时避免重复?
我是JavaScript的新手,但我正在努力。
编辑1:哇,我真的搞砸了我想要做的事情。感谢您帮助我更新了代码。我想要做的是使用nameForLabels
数组中的标签重命名标签。这适用于第一个标签,但后来我收到以下错误:TypeError: labels[i] is undefined
这种情况正在发生,因为labels
永远不会超过1的长度,我认为每次都会重写它而不是写入数组中的下一个位置。为什么x
永远不会高于0?
我希望看到labels
数组中的所有标签都更改为nameForLabels
数组中的标签。例如,labels[0]
中的标签将变为Author 1
,而labels[1]
将变为Author 2
,依此类推。
编辑2:添加了HTML示例:
<div style="display: block;" id="authorView" class="form-horizontal">
<div id="author0" class="form-group">
<div class="col-sm-4 control-label"><label class="" for="author0" id="lblauthor0">Author 1:</label></div>
<div class="col-sm-8">
<div class="input-group"><input class="form-control" ... *keeps going with irrelevant information*
</div>
</div>
<div id="author1" class="form-group">
<div class="col-sm-4 control-label"><label class="" for="author1" id="lblauthor1">Author 2:</label></div>
<div class="col-sm-8">
<div class="input-group"><input class="form-control" ... *keeps going with irrelevant information*
</div>
</div>
<div id="author2" class="form-group">
<div class="col-sm-4 control-label"><label class="" for="author2" id="lblauthor2">Author 3:</label></div>
<div class="col-sm-8">
<div class="input-group"><input class="form-control" ... *keeps going with irrelevant information*
</div>
</div>
<div id="author3" class="form-group">
<div class="col-sm-4 control-label"><label class="" for="author3" id="lblauthor3">Author 4:</label></div>
<div class="col-sm-8">
<div class="input-group"><input class="form-control" ... *keeps going with irrelevant information*
</div>
</div>
<div id="author4" class="form-group">
<div class="col-sm-4 control-label"><label class="" for="author4" id="lblauthor4">Author 5:</label></div>
<div class="col-sm-8">
<div class="input-group"><input class="form-control" ... *keeps going with irrelevant information*
</div>
</div>
</div>
答案 0 :(得分:1)
我不认为这是您的代码,因为您无法使用函数名称循环...除此之外,它确实有效。
https://jsfiddle.net/utswp2v0/
<script type="text/javascript">
function FindGoodFunctionName() {
var authorDivs = document.getElementById('authorView').getElementsByTagName("div");
var labels = [];
for (var i = 0; i < authorDivs.length; i++) {
var labelsFromDiv = authorDivs[i].getElementsByTagName("label");
for (var x = 0; x < labelsFromDiv.length; x++) {
// Just "Not" ! the if statement, don't need to have a empty one
if (typeof labelsFromDiv.item(x) === "undefined" || labelsFromDiv.item(x) == null) { }
else {
labels[x] = labelsFromDiv.item(x);
labels[x].innerHTML = "Author 1";
labels[x].innerHTML = "Author 2";
labels[x].innerHTML = "Author 3"; // This is weird, assigning 3 different value to the same label
}
}
}
}
</script>
<div id="authorView">
<div><label></label><label></label><label></label></div>
<div><label></label><label></label><label></label></div>
<div><label></label><label></label><label></label></div>
</div>
<input type="button" onclick="FindGoodFunctionName();" value="test" />
<强>更新强>
以下是html的外观。
function FindGoodFunctionName() {
var authorLabels = document.getElementById('authorView').getElementsByTagName("label");
var labels = [];
for (var i = 0; i < authorLabels.length; i++) {
labels[i] = authorLabels[i];
labels[i].innerHTML = "aaaa";
}
}