帮忙看一下这个js文件，为什么不起作用呢

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style>
table{
font-size:24px;
font-style:italic;
}
.s1{
background-color:#ff99ee;
}
</style>
<script src="prototype-1.6.0.3.js"></script>
<script>
/*dom方式*/
function addRow(){
var name=$f("name");
var salary=$f("salary");
var td1=document.createElement("td");
var td2=document.createElement("td");
td1.innerHTML=name;
td2.innerHTML=salary;var tr1=document.createElement("tr");
tr1.appendChild(td1);
tr1.appendChild(td2);
$("tb").appendChild(tr1);
}
</script>
</head>
<body style="font-size:30px;"><table width="60%" border="1" cellpadding="0" cellspacing="0" id="tb">
<tr>
<td>姓名<br></td>
<td>薪水 <br></td></tr>
<tr>
<td>zs<br></td>
<td>2000 <br></td></tr>
<tr>
<td>ww <br></td>
<td>3000 <br></td></tr>
</table>
姓名：<input  name="name" id="name"/>薪水：<input name="salary" id="salary"/><input type="button" value="添加"  onclick="addRow();">
</body>
</html>
我的目的是要在文本框中输入内容，然后点添加按钮，就会自动增加一行，为什么没效果呢，求救啊

解决方案 »

  1.   

    input 值的获取有些问题，试试var name=$("name").value;
    var salary=$("salary").value;
      

  2.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
    <style>
    table{
    font-size:24px;
    font-style:italic;
    }
    .s1{
    background-color:#ff99ee;
    }
    </style>
    <script src="prototype-1.6.0.3.js"></script>
    <script>
    /*dom方式*/
    function addRow(){
    var name=$f("name");
    var salary=$f("salary");
    var td1=document.createElement("td");
    var td2=document.createElement("td");
    td1.innerHTML=name;
    td2.innerHTML=salary;var tr1=document.createElement("tr");
    tr1.appendChild(td1);
    tr1.appendChild(td2);
    $("tb").append(tr1);//jquery 中是用append方法，JS中才用appendChild
    }
    </script>
    </head>
    <body style="font-size:30px;"><table width="60%" border="1" cellpadding="0" cellspacing="0" id="tb">
    <tr>
    <td>姓名<br></td>
    <td>薪水 <br></td></tr>
    <tr>
    <td>zs<br></td>
    <td>2000 <br></td></tr>
    <tr>
    <td>ww <br></td>
    <td>3000 <br></td></tr>
    </table>
    姓名：<input name="name" id="name"/>薪水：<input name="salary" id="salary"/><input type="button" value="添加" onclick="addRow();">
    </body>
    </html>我这边也没有prototype-1.6.0.3.js， 只看出来有问题的， 可以一试！
      

  3.   

    function addRow(){
        //获取值
        var name=$("#name").val();
        var salary=$("#salary").val();
        //创建新增的结构
        var tr1=document.createElement("tr");
        var td1=document.createElement("td");
        var td2=document.createElement("td");
        tr1.appendChild(td1);
        tr1.appendChild(td2);
        td1.innerHTML=name;
        td2.innerHTML=salary;
        //追加行
        $("#tb").append(tr1);
    }
    或者:
    function addRow(){
        //获取值
        var name=$("#name").val();
        var salary=$("#salary").val();
        //创建新增行模板
        var template="<tr><td>{0}</td><td>{1}</td></tr>".replace("{0}",name).replace("{1}",salary);
        $("#tb").append(template);
    }
      

  4.   

    DOM对象与jquery对象弄混乱了,另外jquery语法写的也有问题，有三个错误，修改一下：var name=$("#name").val();
    var salary=$("#salary").val();
    $("#tb")[0].appendChild(tr1);
      

  5.   

    DOM对象与jquery对象弄混乱了哦哦 你自己改改啦 我也不是很会的咧~~