Question

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
 <html>
 <head><title>Test</title></head>

<body>
    <table id = "summary">
        <tr>
            <th style="text-align:center">ID</th>
            <th style="text-align:center">Source</th>
            <th style="text-align:center">Operation</th>
        </tr>

        <tr>
            <td style="text-align:center">1</td>
            <td style="text-align:center">EcpR</td>
            <td style="text-align:center"><a href = "javascript:void(0)" onclick = "showDS(1)">detail</a></td>
        </tr>

        <tr>
            <td style="text-align:center">2</td>
            <td style="text-align:center">SrcWP</td>
            <td style="text-align:center"><a href = "javascript:void(0)" onclick = "showDS(2)">detail</a></td>
        </tr>       
    </table>

    <table id = "ds1" style = "display:none">
        <tr>
            <th style="text-align:center">ID</th>
            <th style="text-align:center">Server</th>
            <th style="text-align:center">ConnCount</th>
        </tr>

        <tr>
            <td style="text-align:center">1</td>
            <td style="text-align:center">108.123.0.1</td>
            <td style="text-align:center">26</td>
        </tr>

        <tr>
            <td style="text-align:center">2</td>
            <td style="text-align:center">127.56.27.1</td>
            <td style="text-align:center">127</td>
        </tr>       
    </table>

    <table id = "ds2" style = "display:none">
        <tr>
            <th style="text-align:center">ID</th>
            <th style="text-align:center">Server</th>
            <th style="text-align:center">ConnCount</th>
        </tr>

        <tr>
            <td style="text-align:center">1</td>
            <td style="text-align:center">118.103.10.11</td>
            <td style="text-align:center">206</td>
        </tr>

        <tr>
            <td style="text-align:center">2</td>
            <td style="text-align:center">87.36.127.13</td>
            <td style="text-align:center">17</td>
        </tr>       
    </table>

    <script>
        function showDS(i) {
            var detailedPage = window.open();
            /*
                do something
            */
        }
    </script>
<body>
</html>

我想使用Javascript来解决以下问题：当用户点击第一个＆＃34;详细信息＆＃34;链接，应该打开一个新的html页面，新的html的内容应该与前一个相同，除了＆＃34;摘要＆＃34; table变为＆＃34; display：none＆＃34;和＆＃34; ds1＆＃34; table变为＆＃34; display：block＆＃34;。我想我需要复制旧html的文档对象，有谁知道如何复制包含标签的html内容？

Javascript创建一个修改过的html

0 个答案: