Question

我遇到了错误：

div.setAttribute不是函数

在以下代码段中：

FriendlyChat.prototype.displayMessage = function(key, name, text, picUrl, imageUri) {
  console.log('FriendlyChat.prototype.displayMessage');
  var div = document.getElementById(key);
  // If an element for that message does not exists yet we create it.
  if (!div) {
    var container = document.createElement('div');
    container.innerHTML = FriendlyChat.MESSAGE_TEMPLATE;
    div = container.firstChild;
    div.setAttribute('id', key);
    this.messageList.appendChild(div);
  }
  if (picUrl) {
    div.querySelector('.pic').style.backgroundImage = 'url(' + picUrl + ')';
  }
  div.querySelector('.name').textContent = name;
  var messageElement = div.querySelector('.message');
  if (text) { // If the message is text.
    messageElement.textContent = text;
    // Replace all line breaks by <br>.
    messageElement.innerHTML = messageElement.innerHTML.replace(/\n/g, '<br>');
  } 
};

只要调用上述函数，就会发生错误。我不知道代码有什么问题。

为什么会发生错误？

Answer 1

container.firstChild返回container中的第一个子节点，该子节点可能不是元素（可能是文本节点，注释等）。如果不是元素，则不会有setAttribute。如果要第一个 element 子代，请使用firstElementChild。

旁注：id是一种反映属性，因此您可以写div.id = key;而不是div.setAttribute("id", key);。他们做同样的事情。（这对许多属性（但不是全部）都是正确的； value元素上的input是一个主要的例外，它不是value属性的访问器。）

为什么我的代码中出现“ div.setAttribute不是函数”错误？

1 个答案: