使标题弹出窗口同时出现在多个元素上

，可以通过以下步骤实现：

HTML结构：在需要弹出窗口的元素上添加一个共同的类名或自定义属性，以便在JavaScript中选择这些元素。例如，可以给这些元素添加class="popup-trigger"。
CSS样式：使用CSS样式隐藏弹出窗口，可以设置display:none或者将其位置设置在屏幕外。
JavaScript事件处理：使用JavaScript为这些元素绑定事件处理函数，当元素被点击时触发。可以使用addEventListener方法来绑定事件。
弹出窗口内容：创建一个弹出窗口的HTML结构，并使用CSS样式进行美化。可以在弹出窗口中添加标题和其他内容。
JavaScript逻辑：在事件处理函数中，获取触发事件的元素，并根据需要显示对应的弹出窗口。可以使用querySelectorAll方法选择所有具有共同类名或自定义属性的元素，并遍历它们来添加事件处理。
显示弹出窗口：在事件处理函数中，将弹出窗口的display属性设置为"block"或使用其他方式显示弹出窗口。

以下是一个示例代码：

HTML:

<div class="popup-trigger">元素1</div>
<div class="popup-trigger">元素2</div>
<div class="popup-trigger">元素3</div>

<div class="popup" id="popup1">
  <h3>弹出窗口标题1</h3>
  <p>弹出窗口内容1</p>
</div>

<div class="popup" id="popup2">
  <h3>弹出窗口标题2</h3>
  <p>弹出窗口内容2</p>
</div>

<div class="popup" id="popup3">
  <h3>弹出窗口标题3</h3>
  <p>弹出窗口内容3</p>
</div>

CSS:

.popup {
  display: none;
  position: absolute;
  top: -9999px;
  left: -9999px;
  /* 添加其他样式以美化弹出窗口 */
}

JavaScript:

// 获取所有具有共同类名的元素
var triggers = document.querySelectorAll('.popup-trigger');

// 为每个元素绑定点击事件处理函数
triggers.forEach(function(trigger) {
  trigger.addEventListener('click', function() {
    // 获取对应的弹出窗口ID
    var popupId = this.getAttribute('data-popup-id');
    
    // 显示对应的弹出窗口
    var popup = document.getElementById(popupId);
    popup.style.display = 'block';
  });
});

在上述示例中，我们使用了共同的类名"popup-trigger"来选择所有需要弹出窗口的元素，并为它们绑定了点击事件处理函数。每个元素都可以通过自定义属性"data-popup-id"来指定对应的弹出窗口ID。当元素被点击时，通过获取对应的弹出窗口ID，将其显示出来。

请注意，上述示例仅为演示目的，实际应用中可能需要根据具体需求进行修改和扩展。