fastlion-amis
Version:
一种MIS页面生成工具
62 lines (58 loc) • 2.32 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SVG Viewer</title>
</head>
<body>
<div id="svg-container"></div>
<script>
document.addEventListener('DOMContentLoaded', function () {
// JSON文件的URL
const fileListUrl = './fileList.json';
// 获取SVG容器
const svgContainer = document.getElementById('svg-container');
svgContainer.style.display = 'flex'
svgContainer.style.width = '100vw'
svgContainer.style.flexWrap = 'wrap'
// 从JSON文件中读取文件列表
fetch(fileListUrl)
.then(response => response.json())
.then(fileList => {
// 遍历文件列表
fileList.forEach(fileName => {
// 检查是否为SVG文件
if (fileName.split('.').pop() === 'svg') {
// 加载SVG文件
fetch(`./${fileName}`)
.then(response => response.text())
.then(svgContent => {
// 创建SVG元素并设置内容
const div = document.createElement('div')
const span = document.createElement('span')
const svgElement = document.createElementNS("http://www.w3.org/2000/svg", "svg");
svgElement.setAttribute('width', '50'); // 设置宽度为50px
svgElement.setAttribute('height', '50'); // 设置高度为50px
svgElement.setAttribute('height', '50'); // 设置高度为50px
span.innerText = fileName
svgElement.innerHTML = svgContent;
div.appendChild(svgElement)
div.appendChild(span)
div.onclick = () => {
navigator.clipboard.writeText(fileName)
alert('复制成功')
}
div.style = "border:1px solid"
// 将SVG元素添加到容器中
svgContainer.appendChild(div);
})
.catch(error => console.error(`Error loading SVG ${fileName}:`, error));
}
});
})
.catch(error => console.error('Error fetching file list:', error));
});
</script>
</body>
</html>