Javascript 使用JSHTMLDOM创建聊天气球

当用户在页面上时，我将制作一个弹出的聊天气球。
我的“气球”现在看起来不像聊天气球

应该是这样的：

我不知道如何用HTMLDOM在气球下制作这个东西

我如何能够用JSHTMLDOM做到这一点

我已经知道了：

this.div=document.createElement（'div'）；
//设置div的样式
this.div.style.width='120px'；
this.div.style.height='46px'；
this.div.style.bottom='30%'；
this.div.style.zIndex='999999'；
this.div.style.display='block'；
this.div.style.position='fixed'；
this.div.style.bottom='12%'；
this.div.style.paddingTop='8px'；
this.div.style.color='black'；
this.div.style.right='1%'；
this.div.style.backgroundColor='rgba（2112112112111）'；
this.div.style.borderWidth='1px'；
this.div.style.borderStyle='solid'；
this.div.style.textAlign='center'；
this.div.style.borderRadius=“6px”；
this.div.style.borderColor='浅灰色'；
this.div.setAttribute（“id”、“help”）；
document.body.appendChild（this.div）；
document.getElementById（“help”）.innerHTML=“Kan ik u helpen？”下面是一个类似于您所画图像的示例。您可以在此处查看工作演示：

HTML:

这对你有帮助：也试试那个：不，我不是这个意思！我需要在HTMLDOM中创建它JS@MarioPolio为什么只有js？因为这适用于所有气泡，所以最好在添加气泡时使用CSS规则并简单地分配类是的，但我需要在HTML DOM JS中这样做。你是什么意思？您想使用javascript插入聊天泡泡吗？如果是这样，仍然将css添加到样式表中，并使用JS在需要的地方插入
css语音泡泡
<div class="bubble">CSS Speech Bubble</div>

.bubble 
{
position: relative;
width: 250px;
height: 120px;
padding: 0px;
background: #FFFFFF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border: #7F7F7F solid 5px;
}

.bubble:after 
{
content: '';
position: absolute;
border-style: solid;
border-width: 26px 15px 0;
border-color: #FFFFFF transparent;
display: block;
width: 0;
z-index: 1;
bottom: -26px;
left: 35px;
}

.bubble:before 
{
content: '';
position: absolute;
border-style: solid;
border-width: 30px 19px 0;
border-color: #7F7F7F transparent;
display: block;
width: 0;
z-index: 0;
bottom: -35px;
left: 31px;
}