將這個例子改為用純JavaScript寫

本帖最后由 zenpignoy 于 2011-04-26 11:47:49 编辑

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title></title>
    <style type="text/css">
        table td {
            background: #ffffff;
        }        .test {
            background: red;
        }
    </style>
</head>
<body>
<center>
    <table id="mytab">
        <tr>
            <td>1-1</td>
            <td>1-2</td>
            <td>1-3</td>
            <td>1-4</td>
        </tr>
        <tr>
            <td>2-1</td>
            <td>2-2</td>
            <td>2-3</td>
            <td>2-4</td>
        </tr>
        <tr>
            <td>3-1</td>
            <td>3-2</td>
            <td>3-3</td>
            <td>3-4</td>
        </tr>
    </table>
    <input type="button" id="ts" name="test" value="測試">
</center><script type="text/javascript">
var cells = document.getElementById('mytab').getElementsByTagName('td');
for (var i = 0; i < cells.length; i ++) {
cells[i].onclick = function() {
if (this.className == 'test') this.className = '';
else this.className = 'test';
}
}
document.getElementById('ts').onclick = function() {
var ckvalArr = new Array();
for (var i = 0; i < cells.length; i ++) {
if (cells[i].className == 'test') ckvalArr.push(cells[i].innerHTML);
}
alert(ckvalArr.join(','));
}
</script>
</body>
</html>
cktd.get(i) // 返回的是一个dom节点  cktd.get(i).innerHTML
cktd.eq(i) //返回的是一个jquery对象 cktd.eq(i).html()