如何使这个jQuery代码段更紧凑？

请注意，这两者几乎相同。

尝试以下方法：

$selectMenus = $("#experiences").find('select');

$tab.find('input').each(function(i) {
    var $elem = $(this);
    var value = $elem.attr('value');
    if(!value)
        value = ' ';
    $parent = $elem.parent();
    $elem.remove();
    $parent.html(value);
});

$tab.find('select').each(function(i) {
    $('option', this)[$selectMenus[i].selectedIndex].selected = true;
    var $elem = $(this);
    var value = $elem.attr('value');
    if(!value)
        value = ' ';
    $parent = $elem.parent();
    $elem.remove();
    $parent.html(value);
});

试试这个：

$selectMenus = $("#experiences").find('select');

$tab.find('input').each(function(i) {
    var $elem = $(this);
    var value = $elem.attr('value');
    if(!value)
        value = ' ';
    $parent = $elem.parent();
    $elem.remove();
    $parent.html(value);
});

$tab.find('select').each(function(i) {
    $('option', this)[$selectMenus[i].selectedIndex].selected = true;
    var $elem = $(this);
    var value = $elem.attr('value');
    if(!value)
        value = ' ';
    $parent = $elem.parent();
    $elem.remove();
    $parent.html(value);
});

---

我可以看到这种优化：

var i = 0;
$tab.find('input, select').each(function() {
    var $elem = $(this);

    if (this.tagName == 'select')
        $elem.val($selectMenus[i++].selectedIndex)

    var value = $elem.val();

    $elem.parent().html(value ? value : ' ');
});

---

我认为如果你已经替换了父HTML，你就不必再删除元素了，因为它已经被替换了（如果我错了，有人纠正我）。不过，压缩它的方式只是个人偏好的一种方式。也要时刻牢记可读性。太多这样的优化可能会使深入研究变得非常困难。我认为，出于规模考虑，生产代码的JavaScript打包机可能也是一个不错的选择。

我可以看到这种优化：

var i = 0;
$tab.find('input, select').each(function() {
    var $elem = $(this);

    if (this.tagName == 'select')
        $elem.val($selectMenus[i++].selectedIndex)

    var value = $elem.val();

    $elem.parent().html(value ? value : ' ');
});

---

我认为如果你已经替换了父HTML，你就不必再删除元素了，因为它已经被替换了（如果我错了，有人纠正我）。不过，压缩它的方式只是个人偏好的一种方式。也要时刻牢记可读性。太多这样的优化可能会使深入研究变得非常困难。我认为，出于大小考虑，生产代码的JavaScript打包程序可能也是一个不错的选择。

这取决于输入元素不包含选项元素，但我认为这正是您需要的。在没有选项元素的情况下，不应用该属性。请注意，如果要替换父元素的HTML，则无需从DOM中显式删除其子元素

function doSomething(elem)
{
    var value = $(elem).attr('value') ? $(elem).attr('value') : ' ';
    $(elem).parent().html(value);
}

$tab.find('input').each(function(i) {
    doSomething(this);
});

$tab.find('select').each(function(i) {
    $('option', this)[$selectMenus[i].selectedIndex].selected = true;
    doSomething(this);
});

---

这取决于输入元素不包含选项元素这一事实，但我认为这正是您需要的。在没有选项元素的情况下，不应用该属性。请注意，如果要替换父元素的HTML，则无需从DOM中显式删除其子元素

function doSomething(elem)
{
    var value = $(elem).attr('value') ? $(elem).attr('value') : ' ';
    $(elem).parent().html(value);
}

$tab.find('input').each(function(i) {
    doSomething(this);
});

$tab.find('select').each(function(i) {
    $('option', this)[$selectMenus[i].selectedIndex].selected = true;
    doSomething(this);
});

---

---

find（'input，select'）是我喜欢的，但注意变量I，它是困难所在。find（'input，select'）是我喜欢的，但注意变量I，它是困难所在。你能通过以下方法优化它：find（'input，select'）？主要困难是由变量i引起的。。。看起来都不太好看。我同意tvanfosson解决方案是最好的：）您可以通过以下方式对其进行优化：find（'input，select'）？主要困难是由变量i引起的。。。看起来都不太好看。我同意tvanfosson的解决方案是最好的：）如果你接受76%的未被接受的问题中的一些，你可能会得到更好的回复率。（我承认其中一些问题可能还没有答案。）你在开玩笑吗，里塞博？天哪！编辑我的答案-不发短信，尽管他不接受答案有点烦人。有一种情况，一个答案有22张赞成票，正确，不被接受。如果你接受76%的未被接受的问题中的一些，你可能会得到更好的回答率。（我承认其中一些问题可能还没有答案。）你在开玩笑吗，里塞博？天哪！编辑我的答案-不发短信，尽管他不接受答案有点烦人。有一个答案有22张赞成票，是正确的，但不被接受。你没有注意变量i。虽然它几乎在那里。修正了。需要再次遍历列表以查找指定的索引。几乎正确，但在运行之前应确保i>=0:$（elem）.find（'option'）.eq（$selectMenus[i].selectedIndex）.attr（'selected'，'selected'）；否则将意外终止。您没有注意变量i。尽管它几乎在那里。已修复。需要再次遍历列表以查找指定的索引。几乎正确，但在运行之前应确保i>=0:$（elem）.find（'option'）.eq（$selectMenus[i].selectedIndex）.attr（'selected'，'selected'）；否则将意外终止。