Question

我是javascript的新手，我正在使用PHP变量动态创建链接，如下所示

$addlink = '<button class="blueBtn btnSmall" id="current'.$product_id.'"    onClick=addcart('.@$product_id.',"add")><span class="allitem"
<font color="#A2F3AB">Added</font></span></button>';

这是我的动态创建的php变量，如下所示添加了添加了添加了

我想通过一次点击将所有变量“添加”的内容更改为“添加”，我使用ajax函数更改下面给出的文本。

function clearcart(msg) {
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else { // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById('cartreturn').innerHTML = xmlhttp.responseText;
            document.getElementsByClassName('allitem').innerHTML = "Add";

        }
    }
    xmlhttp.open("GET", "/addcart.php?msg=" + msg, true);
    xmlhttp.send();
}

但是第一个链接文本只受影响..其他不影响我如何解决这个问题

Answer 1

document.getElementsByClassName返回NodeList。你必须遍历所有元素：

var allItems = getElementsByClassName('allitem');
for (var i = 0; i < allItems.length; i++) {
    allItems[i].innerHTML = 'Add';
}

Answer 2

请参阅this question。

你不能document.getElementsByClassName('allitem').innerHTML。

您可以执行document.getElementsByClassName('allitem')[0].innerHTML = "Add"

你有几个“allitem”类的元素吗？如果你不这样做，那么也许你应该使用id而不是类，然后调用document.getElementById('allitem').innerHTML = "Add";

ajax调用时javascript动态内容不受影响

2 个答案: