课表，拖拽

html>
head>
    meta charset="UTF-8">
    meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    meta http-equiv="X-UA-Compatible" content="ie=edge">
    title>Documenttitle>
    style>
        table {
            border-collapse: collapse;
        }

        th {
            border: 1px solid #000;
            width: 100px;
            height: 50px;
            text-align: center;
        }

        td {
            border: 1px solid #000;
            width: 100px;
            height: 50px;
            text-align: center;
        }

        .container {
            display: flex;
        }

        .left {
            width: 120px;
            border: 1px solid #000;
            overflow: auto;
        }

        .item {
            width: 100px;
            height: 50px;
            line-height: 50px;
            text-align: center;
            border: 1px solid #000;
            margin: 10px;
        }

        .hover {
            background: #ccc;
        }
    style>
head>
body>
div class="container">
    div class="left" data-drop="move">
        div data-effect="copy" draggable="true" class="item" style="background: blue">语文div>
        div data-effect="copy" draggable="true" class="item" style="background: green">英语div>
        div data-effect="copy" draggable="true" class="item" style="background: red">数学div>
        div data-effect="copy" draggable="true" class="item" style="background: yellowgreen">科学div>
        div data-effect="copy" draggable="true" class="item" style="background: teal">物理div>
        div data-effect="copy" draggable="true" class="item" style="background: blueviolet">化学div>
        div data-effect="copy" draggable="true" class="item" style="background: aqua">食物div>
        div data-effect="copy" draggable="true" class="item" style="background: saddlebrown">美食div>
        div data-effect="copy" draggable="true" class="item" style="background: hotpink">足球div>
    div>
    div class="right">
        table>
            tr>
                th>th>
                th>星期一th>
                th>星期二th>
                th>星期三th>
                th>星期四th>
                th>星期五th>
                th>星期六th>
                th>星期日th>
            tr>
            tr>
         服务器托管网       td rowspan="2">早自习td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
            tr>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
            tr>
                td rowspan="4">上午td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
            tr>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
服务器托管网                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
            tr>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
            tr>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
            tr>
                td rowspan="4">下午td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
            tr>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
            tr>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
            tr>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
            tr>
                td rowspan="2">晚自习td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
            tr>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
                td data-drop="copy">td>
            tr>
        table>
    div>
div>
script>
    const container = document.querySelector('.container');
    let sourceNode = null;
    function getDropNode(node) {
        while (node) {
            if (node?.dataset?.drop) {
                return node;
            }
            node = node?.parentNode;
        }
    }
    function clearDropStyle() {
        const dropNodes = document.querySelectorAll('[data-drop]');
        dropNodes.forEach(node => {
            node.classList.remove('hover');
        })
    }
    container.addEventListener('dragstart', function (e) {
        e.dataTransfer.effectAllowed = e.target.dataset.effect;
        sourceNode = e.target;
    })
    container.addEventListener('dragover', function (e) {
        e.preventDefault();
    });
    container.addEventListener('dragenter', function (e) {
        clearDropStyle();
        const dropNode = getDropNode(e.target);
        if (!dropNode) return;
        if (e.dataTransfer.effectAllowed === dropNode.dataset.drop) {
            dropNode.classList.add('hover');
        }
    })
    container.addEventListener('drop', function (e) {
        clearDropStyle();
        const dropNode = getDropNode(e.target);
        if (!dropNode) return;
        if (e.dataTransfer.effectAllowed != dropNode.dataset.drop) return;
        if (e.dataTransfer.effectAllowed === 'copy') {
            dropNode.innerHTML = ''
            const clone = sourceNode.cloneNode(true);
            clone.dataset.effect = 'move';
            dropNode.appendChild(clone);
        } else {
            sourceNode.remove();
        }
    })
script>
body>
html>

服务器托管，北京服务器托管，服务器租用 http://www.fwqtg.net

相关推荐: 使用自定义XML配置文件在.NET桌面程序中保存设置
1. 背景
2. 常见的配置文件格式
3. HackerScreenSaver 的配置选择
4. 最后

本文将详细介绍如何在.NET桌面程序中使用自定义的XML配置文件来保存和读取设置。除了XML之外，我们还将探讨其他常见的配置文件格式，如JSON、INI和YAML，以及它们的优缺点和相关的NuGet类库。最后，我们将重点介绍我们为何选择XML作为配置文件格式，…