javascript - jQuery 可以缩短一系列 innerHTML 语句吗？

Question

在我的网站上，我有两个函数和几个连续的 javascript innerHTML 语句，如下所示:

function myFunction(a, b, c, d, e, f, g) {
//Lots of code then
    document.getElementById("id1").innerHTML = a;
    document.getElementById("id2").innerHTML = b;
//Five more lines of this through parameter g
}

第一个函数有七个参数的七行，第二个函数有 16 个参数的 16 行。我明白(如果我使用 jQuery 并且我用数字约定命名每个 id，见下文)我可以缩短这段代码如下(以函数 2 为例):

function myFunction2(a, b, c, .......p) {
//Lots of code then
    var z, myArray = [a, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p];
    for (z in myArray) {
        $("#id" + (z + 1)).html(myArray[z]);//used z to avoid name collision with a through p
    } 
}

有什么方法可以使用 jQuery 来执行以下操作吗？

function myFunction2(a, b, c, .......p) {
//Lots of code then
    $("#id1, #id2, ....... #id16").html(a, b, c.......p);
}

我的想法是每个 id 将与 html() 语句中的每个参数相匹配。我在搜索中没有找到任何这样的例子。我不认为这段代码(如果可能的话)甚至不一定比上面的 for 循环更好，但它节省了几行，因此问题。感谢您的任何回答

Answer 1

如果您的 ID 确实以数字命名，则不需要 jQuery 来缩短名称:

function myFunction2(/* don't need the parameter list */) {
  //Lots of code then

  for ( var i = 0; i < arguments.length; ++i )
  {
    document.getElementById( 'id' + (i + 1) ).innerHTML = arguments[i];
  }
}

或者传入一个前缀以将其用于不同的 ID 集，这一切都取决于传递的参数数量:

function myFunction2(prefix) {
  //Lots of code then

  for ( var i = 1; i < arguments.length; ++i )
  {
    document.getElementById( prefix + i ).innerHTML = arguments[i];
  }
}

myFunction2('id', "a", "b", "c");  // sets #id1, #id2, #id3 to a, b, c
myFunction2('other", "x", "y");    // sets #other1, #other2 to x, y