Question

我有一个html文件，其中包含一个包含字段的表。某些字段标有xxx，应转换为textareas。这已成功完成：

function raplace() {

    var replaced = $("body").html().replace(/xxx/g,'<textarea class="textarea" id=0 style="width: 100%; height: 100%; min-height:3em; box-sizing: border-box; resize: none; border:none"></textarea>');

    $('body').html(replaced);
}

现在的任务是为第一个textarea name="text1"，第二个区域name="text2"分配一个名称属性，依此类推。为了实现这一点，我特意为所有文本区域设置id=0，您可以从上面的代码中看到。我试图通过使用此代码来实现目标：

var i=1;
    while (document.getElementById('0')) {

        //$('#0')[0].name = 'text'+i;
        //$('#0')[0].id = i;

        document.getElementById("0").name = "text" + i;
        document.getElementById("0").id = i;

        //document.getElementById("0").setAttribute("name","text"+i);
        //document.getElementById("0").setAttribute("id",i);
        i++;

正如您所知，上述所有三个代码都在工作并执行相同的操作。然而，这是一个大问题。

当我将代码放入浏览器控制台时，它会按预期执行，完美地更改名称和ID属性。但是，如果代码放入我的文件中，它只生成textareas，设置所有id = 0。不执行脚本的第二部分（更改属性值）。我已经在网上看了很多天了，并且已经在堆栈溢出时请求这里。它如果有人可以帮助我，那将是惊人的。感谢!!!

注意：第一部分需要先执行，否则你就没有目标ID。

编辑：稍微清理一下代码，这就是我所拥有的。如果有人知道为什么第二部分没有执行，请告诉我。谢谢！

function raplace() {

    var replaced = $("body").html().replace(/xxx/g,'<textarea class="replacement" style="width: 100%; height: 100%; min-height:3em; box-sizing: border-box; resize: none; border:none"></textarea>');

    var replacements = document.getElementsByClassName('replacement');
    var txtArea;

    for (var i = 0; i < replacements.length; i++) {
        txtArea = replacements[i];
        txtArea.id = "text" + i;
        txtArea.name = "text" + i;
    }

$('body').html(replaced);
}

Answer 1

这里有一些糟糕的做法可能会影响您的解决方案：

您的身份证不以信件开头。请参阅：What are valid values for the id attribute in HTML?
您有多个具有相同ID的元素。

一个建议是使用一个类来定位你的元素，例如

'<textarea class="textarea replacement"' // etc

然后..

var replacements = document.getElementsByClassName('replacement'),
    txtArea;

for (var i = 0; i < replacements.length; i++) {
    txtArea = replacements[i];
    txtArea.id = "text" + i;
    txtArea.name = "text" + i;
}

javascript更改标签属性没有按正确的顺序执行？

1 个答案: