일상 의 말 이 조리 가 없으니, 오늘 은 테이블 을 총괄하자

나는 또 함부로 지껄였다.표는 우리가 반드시 빼놓을 수 없는 것이다.OK, 먼저 input 태그를 몇 개 씁시다.

<body>
age：<input type="text" name="" id="age">
name:<input type="text" name="" id="name">
<input type="submit" value="check" id="check">
<input type="text" id="tex" value="" placeholder="search">
<button id="sea" type="">searchbutton>
<table id="tab" style="border-collapse:collapse;table-layout:fixed;" border="1px solid #222" cellspacing="0">
    <thead >
      <tr>
        <th>idth>
        <th>ageth>
        <th>nameth>
        <th>delth>
      tr>
    thead>
    <tbody>
      <tr>
        <td width="20px">1td>
        <td>10td>
        <td>jokertd>
        <td><a href="javescript:;">dela>td>
      tr>
      <tr>
        <td>2td>
        <td>memonytd>
        <td>13td>
        <td><a href="javescript:;">dela>td>
      tr>
      <tr>
        <td>3td>
        <td>dollortd>
        <td>18td>
        <td><a href="javescript:;">dela>td>
      tr>
      <tr>
        <td>4td>
        <td>bbotd>
        <td>16td>
        <td><a href="javescript:;">dela>td>
      tr>
      <tr>
        <td>5td>
        <td>Abctd>
        <td>9td>
        <td><a href="javescript:;">dela>td>
      tr>
    tbody>
  table>
body>

레이아웃이 끝났습니다. 다음에 계속할 코드 코드입니다.먼저 라운드 정의

window.οnlοad=function(){
 var oTr = document.getElementsByTagName('tr')
 var oTab = document.getElementById('tab')
 var row = oTab.getElementsByTagName('tbody')[0].getElementsByTagName('tr')[0]
//    
 var oTrs =oTab.tBodies[0].rows;
 var oCol = null;
 for(var i = 0;iif(i%2==0){
 oTrs[i].style.background = '#bbb';
 }
 oTrs[i].mouseover=function(){
 oCol = this.style.backgroundColor;
 this.style.backgroundColor = '#fff';
 }
 oTrs[i].mouseout = function(){
 this.style.backgroundColor = oCol;
 }
 }
}

ok, 위쪽은 칸막이 변색.다음은 증감 행수를 쓰시오.

    var oAge = document.getElementById('age')
    var oName = document.getElementById('name')
    var Che = document.getElementById('check')
    var di = oTab.tBodies[0].rows.length
    Che.οnclick=function(){
        var or = document.createElement('tr')
        var od = document.createElement('td')
        or.appendChild(od)

        var od = document.createElement('td')
       od.innerHTML = oAge.value;
       or.appendChild(od)

       var od = document.createElement('td')
       od.innerHTML = oName.value;
       or.appendChild(od)

       var od = document.createElement('td')
       od.innerHTML = 'del'
       or.appendChild(od)

       oTab.tBodies[0].appendChild(or);

       var arr = oTab.tBodies[0].getElementsByTagName('a')
       var oa = document.getElementsByTagName('a')
       for(var j = 0;jfunction(){
    oTab.tBodies[0].removeChild(this.parentNode.parentNode)
}
}
}

일상 의 말 이 조리 가 없으니, 오늘 은 테이블 을 총괄하자

좋은 웹페이지 즐겨찾기