用js写一个弹窗公告代码公告内容支持html

以下是用JavaScript实现的弹窗公告代码，可以支持HTML内容：

HTML代码：

<button onclick="showPopup()">显示公告</button>
<div id="popup" style="display: none;">
  <div id="popup-content"></div>
  <button onclick="hidePopup()">关闭</button>
</div>

JavaScript代码：

function showPopup() {
  const popup = document.getElementById('popup');
  popup.style.display = 'block';
  const popupContent = document.getElementById('popup-content');
  popupContent.innerHTML = '<h2>公告标题</h2><p>这是一条公告内容，支持<strong>HTML</strong>格式。</p>';
}

function hidePopup() {
  const popup = document.getElementById('popup');
  popup.style.display = 'none';
}

在HTML中，我们定义了一个按钮和一个弹窗容器。弹窗容器包括一个内容区域和一个关闭按钮，初始状态下是隐藏的。

在JavaScript中，我们定义了两个函数：showPopup和hidePopup。showPopup函数用于显示弹窗，它首先获取弹窗容器和内容区域的DOM元素，然后将弹窗容器的样式设置为block，使其显示出来。接着，我们使用innerHTML属性将内容区域的HTML内容设置为我们想要显示的公告内容，这里我们使用了一些HTML标签来格式化内容。最后，当用户点击关闭按钮时，hidePopup函数会将弹窗容器的样式设置为none，使其隐藏起来。

这个代码可以通过修改HTML和JavaScript中的内容来显示不同的公告内容和样式。