Question

我有HTML表单，文本数组与表单中标签标签的确切数量相匹配。

形式：

<label id="1">First</label>
<label id="2">Second</label>
<label id="3">Second</label>
<label id="4">Third</label>
<label id="5">Fourth</label>
<label id="6">Fifth</label>
<label id="7">Fifth</label>
<label id="8">Fifth</label>

阵列

X1
X2
X3
X4
X5

如何遍历表单，获取其中的标签列表，并在标签内添加文本列表作为span。还要检查文本是否以某些文本开头（以检查副本）并添加第一个元素的相同值。如下例所述，最终形式必须如下：

<label id="1"><span>X1</span>First</label>
<label id="2"><span>X2</span>Second</label>
<label id="3"><span>X2</span>Second</label>
<label id="4"><span>X3</span>Third</label>
<label id="5"><span>X4</span>Fourth</label>
<label id="6"><span>X5</span>Fifth</label>
<label id="7"><span>X5</span>Fifth</label>
<label id="8"><span>X5</span>Fifth</label>

Answer 1

使用each和html方法迭代并获取/设置元素的HTML。我没有使用X...值的数组，而是建议在字符串和这些值之间使用映射。请参阅以下示例：

var map = {
    "First": "X1",
    "Second": "X2",
    "Third": "X3",
    "Fourth": "X4",
    "Fifth": "X5"
};
$("label").each(function (i) {
   var $this = $(this)
   var html = $this.html();
   var newText = map[html];
   
   $this.html("<span>" + newText + "</span> " + html);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label id="1">First</label>
<label id="2">Second</label>
<label id="3">Second</label>
<label id="4">Third</label>
<label id="5">Fourth</label>
<label id="6">Fifth</label>
<label id="7">Fifth</label>
<label id="8">Fifth</label>

作为替代方案，您可能希望使用prepend函数添加span元素：

$this.prepend("<span>" + newText + "</span> ");

Answer 2

使用jQuery的.each和.prepend函数。

例如，这将起作用：

public boolean onOptionsItemSelected(MenuItem item) {
    switch (item.getItemId()) {
        case (R.id.reset):
            number1.setText(null);
            number2.setText(null);
            //Snackbar.make(findViewById(android.R.id.content) , "Text", Snackbar.LENGTH_SHORT).setAction("Action", null).show();
            break;
        case (R.id.quit):
             finish();
             break;
    }

    return super.onOptionsItemSelected(item);
}

您可以更简单地执行此操作，而无需维护阵列：

<script>
    var arr = [ 'X1', 'X2', 'X3', 'X4', 'X5' ];
    $(document).ready(function(){
        $( "label" ).each(function ( index ) {
            $(this).prepend("<span>" + arr[index] + "</span>");
        });
    });
</script>

<强>更新请注意，此解决方案仅适用于具有连续键的数字数组（1-9）。如果您需要其他订单（“问题中的”1,2,2,3,4,5,5,5“），我建议您遵循IonicăBizău提出的解决方案。

将数组添加到DOM元素数组中

2 个答案: