Question

我试图动态生成聊天但是消息插入到上一个含义之下，用户必须向下滚动才能看到一条非常好的新消息！我试图更改它，以便将消息插入到最后一条消息之上。

var elementDiv = document.createElement("div");
elementDiv.className = "chat-message error";
elementDiv.appendChild(document.createTextNode(chatBoxMessage));
//Insert message
var oldMsg = "chat-message";
document.getElementsByClassName('message-window').appendChild(elementDiv);
document.body.insertBefore(elementDiv, oldMsg);

变量chatBoxMessage用于定义文本。

运行它会抛出错误 -

Uncaught TypeError: Failed to execute 'insertBefore' on 'Node' : parameter 2 is not of type 'Node'.

Answer 1

似乎oldMsg是字符串类型。您必须使用oldMsg调用document.createTextNode才能使其正常工作。

Answer 2

您可能需要将邮件包装在文本节点中。

document.createTextNode("chat-message");

您的错误消息表明您的文字不是有效节点。

参数2不属于＆＃39;节点＆＃39;

请参阅：MDN - Document.createTextNode()

＆＃13;

onReady('#message-window', function() {
  pushNewMessage('Third!');
  pushNewMessage('Second!');
  pushNewMessage('First!');
});

function pushNewMessage(chatBoxMessage) {
  var errorMessageDiv = document.createElement('div');
  errorMessageDiv.className = 'chat-message error';
  errorMessageDiv.appendChild(document.createTextNode(chatBoxMessage));

  //Insert message
  var messageWindow = document.getElementById('message-window');
  
  messageWindow.insertBefore(errorMessageDiv, messageWindow.firstChild);
}

// Convinience function -- Wait for element or body load...
function onReady(selector, callback, ms) {
  var intervalID = window.setInterval(function() {
    if ((document.querySelector(selector) || document.body) !== undefined) {
      window.clearInterval(intervalID);
      callback.call(this);
    }
  }, ms || 500);
}

＆＃13;

<div id="message-window">
</div>

＆＃13;

Answer 3

我做了一个示例实现。希望这就是你要找的东西：

HTML：

// select the container
var container = document.getElementById('container');

// create chat messages
var msg1 = createChatMsg('Chat1');
var msg2 = createChatMsg('Chat2');
var msg3 = createChatMsg('Chat3');

// Insert Messages
container.insertBefore(msg1, container.firstChild);
container.insertBefore(msg2, container.firstChild);
container.insertBefore(msg3, container.firstChild);

// create chatmessage
function createChatMsg(message) {
  var chatMsg = document.createElement('div');
  chatMsg.className = 'some-chat';
  chatMsg.appendChild(document.createTextNode(message));

  return chatMsg;
}

使用Javascript：

display dialog "Your Computer Has Been Taken Over By Ninja Cows With Flamethrowers!" buttons {"Ok......"} default button 1

display dialog "How Would You Like To Proceed?" buttons {"Milk Them", "Burn Them", "Do Nothing"} default button 1

if the button returned of the result is "Milk Them" then
    beep 1
    delay 1
    display dialog "You milk them day and night but unlucky you spilt the milk on to the computer, the computer crashes and the batery shoots out, you failed" buttons {"Wait, What?"} default button 1
    tell application "Finder"

        shut down
    end tell
else

    if the button returned of the result is "Do Nothing" then
        display dialog "The cows look at you, they are just staring eager to destroy somthing, after 23 hours and 59 minutes they burn the place to the ground, rupturing the lithium ion battery.
your computer explodes, you explode and everything explodes." buttons {"Wait, What?"} default button 1
        tell application "Finder"

            shut down
        end tell
    end if


    if the button returned of the result is "Burn Them" then
        display dialog "You grab a even bigger flamethrower from your bottemless bag and burn them to the ground YOU DID IT!, unfortunataly apples new chipset in not designed to withstad such heat, the computer explodes, you explode, everything explodes. Hey, atleast you got the cows this time.." buttons {"Wait, What?"} default button 1
        tell application "Finder"

            shut down
        end tell
    end if

end if
end

希望这有助于您正在寻找的东西。示例实施：http://jsfiddle.net/f1d02e49/

前置元素

3 个答案: