将文本添加到<p> </p>时，I​​mg消失

Question

我想在包含图像的div中的

元素中添加一些动态文本，但是在添加文本时图像会消失。我的函数位于单击事件处理程序中，除了消失的图像外，还按预期执行。我知道这很简单但是自学成才并不总是适合我。

HTML             

           

CSS     ＃score-message {       位置：绝对的;       宽度：20％;       高度：200像素;       背景色：＃8FBC8F;     }

JQ功能

function score_message(score) {
  if(score == 5) {
var message = "Congratulations, etc, etc";
$('#score-message').first('p').text(message).show().offset({top:300, left:850});
}

Answer 1

如果图像在第一个“p”标签内，则通过调用文本覆盖它。试试这个：

var pTag = $('#score-message').first('p');
pTag.html(pTag.html() + " HA! HA! HA! YOU A WINNER!!!");

注意使用html而不是文本。我相信文本会剥离标记，或者至少不会将其视为处理标记并将其删除。

您还可以执行以下操作：

pTag.append(" HA! HA! HA! YOU A WINNER!!!");