JavaScript 在网页上单击鼠标的地方显示层及关闭层

在JavaScript中，要实现单击鼠标的地方显示一个层（通常是一个`div`元素），并在再次单击时关闭这个层，你可以通过监听`document`的`click`事件来实现。下面是一个简单的实现示例：

// 假设我们有一个初始未显示的层
const overlay = document.createElement('div');
overlay.style.position = 'absolute';
overlay.style.display = 'none'; // 初始不显示
overlay.style.backgroundColor = 'rgba(0, 0, 0, 0.5)'; // 半透明背景
overlay.style.padding = '20px';
overlay.style.color = 'white';
overlay.textContent = '这是一个层';
document.body.appendChild(overlay);

// 监听整个文档的点击事件
document.addEventListener('click', function(event) {
    // 检查是否已经显示层
    if (overlay.style.display === 'none') {
        // 如果没有显示，则显示层，并设置其位置为点击位置
        overlay.style.display = 'block';
        overlay.style.left = `${event.clientX}px`;
        overlay.style.top = `${event.clientY}px`;
    } else {
        // 如果已经显示，则隐藏层
        overlay.style.display = 'none';
    }
});

这段代码首先创建了一个`div`元素作为层，并将其添加到`body`中，但初始时不显示。然后，它给整个`document`添加了一个点击事件监听器。当点击事件发生时，如果层是隐藏的，则将其显示，并设置其位置为点击的位置。如果层已经是显示的，则将其隐藏。

注意，这个简单的示例没有考虑层的大小和样式，你可能需要根据实际需求调整`overlay`的样式。此外，如果页面上还有其他元素需要处理点击事件，你可能需要添加额外的逻辑来避免在点击这些元素时触发层的显示或隐藏。