在H5中，写一个loading加载的组件

好的，我可以给您提供一个简单的loading加载组件的示例代码。首先，我们需要在HTML文件中添加一个div元素，用于显示loading效果：

<div id="loading" class="loading">
    <div class="loading-icon"></div>
</div>

接下来，我们需要定义CSS样式，实现loading图标的样式和动画效果：

.loading {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background-color: rgba(0, 0, 0, 0.5);
}

.loading-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -20px;
    margin-left: -20px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 4px solid #fff;
    border-top-color: #007aff;
    animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

最后，我们需要编写JavaScript代码，实现控制loading组件的显示和隐藏：

var loading = {
    show: function() {
        document.getElementById('loading').style.display = 'block';
    },
    hide: function() {
        document.getElementById('loading').style.display = 'none';
    }
};

这样，我们就完成了一个简单的loading加载组件。使用时，只需要调用loading.show()方法显示loading，调用loading.hide()方法隐藏loading即可。