javascript - 如何在 Javascript 中为特定属性赋值

Question

我正在实现一个扩展表单函数，其中我需要增加某些属性，包括 data-display="#display_student_1_gender" 等属性。

查找属性没有问题，但当我尝试重命名它时失败(如下标记)。给出了什么？

Javascript:

<script>
var counter = 0;
function moreFields(val1, val2, val3) {
    counter++;
    var newField = document.getElementById(val1).cloneNode(true);
    newField.id = '';
    newField.style.display = 'block';
    var newFields = newField.querySelectorAll('[name], [id], [for], [data-display]');
        for (var i=0;i<newFields.length;i++) {
            var theNames = newFields[i].name
            if (theNames)
                newFields[i].name = "data[" + val3 + "][" + counter + "][" + theNames + "]";
            var theNames2 = newFields[i].id;
            if (theNames2)
                newFields[i].id = theNames2 + counter;
            var theNames3 = newFields[i].htmlFor;
            if (theNames3)
                newFields[i].htmlFor = theNames3 + counter;
            var theNames4 = newFields[i].attr('data-display'); //line 14 Error
            if (theNames4)
                newFields[i].attr('data-display') = theNames4 + counter;    
        }           
    var insertHere = document.getElementById(val2);
    insertHere.parentNode.insertBefore(newField,insertHere);
}
</script>

Answer 1

您正在处理 dom element(newFields[i]) 引用，它没有像 attr() 这样的方法(我认为您是从一些 jQuery 引用中获得的 -但由于您没有使用 jQuery 标记问题，我假设您没有使用它)。

您需要使用 getAttribute() 和 setAttribute() 来获取/设置属性值

var theNames4 = newFields[i].getAttribute('data-display');
newFields[i].setAttribute('data-display', theNames4 + counter)

或者如果您使用数据 API

var theNames4 = newFields[i].dataset.display;
newFields[i].dataset.display = theNames4 + counter