Question

如果我有一个简单的html表：

<table>
  <tr>
    <th>header</th>
  </tr>
  <tr>
    <td class="count test">423</td>
  </tr>
</table>

如何从td中提取整数以便我可以对其进行操作？以下代码返回undefined：

function changeCount(){
    var count = $("td.count.test").val();
    alert(count);   
}
changeCount();

完成html：

<html>
 <head>
     <title>Creation of array object in javascript</title>
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
     <script language="javascript" >


    function changeCount(){
        var count = $("td.count.test").text();
        console.log(count); 
    }
    changeCount();
    </script>

    <style>
    td{width:200px;text-align:center;}
    </style>
</head>
<body>
<table>
    <tr>
        <th>header</th>
    </tr>
    <tr>
        <td class="count test">423</td>
    </tr>
</table>
</body>
</html>

Answer 1

.val()不是<td>，而是.text()。

function changeCount(){
    var count = $("td.count.test").text();
    alert(count);   
}

请注意，如果有多个此类<td>元素，则会返回DOM中第一个元素的内容。

.val()方法用于获取<input>，<select>和<textarea>元素的“value”属性。在任何一种情况下，DOM访问都会给你一个字符串。如果您需要使用该值进行计算，则应通过parseInt()或其他几种技巧将其强制为数字。

Answer 2

问题是你试图通过JavaScript访问东西，这在你的函数执行时在DOM树中是不可用的。您需要确保在加载整个DOM树之后或者至少在您的函数所需的元素是文档DOM树的一部分之后触发changeCount()。

<html>
 <head>
     <title>Creation of array object in javascript</title>
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
     <script language="javascript" >


    function changeCount(){
        var count = $("td.count.test").text();
        console.log(count); 
    }
    $(document).ready(function(){
        changeCount();
    });        
    </script>

    <style>
    td{width:200px;text-align:center;}
    </style>
</head>
<body>
<table>
    <tr>
        <th>header</th>
    </tr>
    <tr>
        <td class="count test">four twenty three</td>
    </tr>
</table>
</body>
</html>

从td中提取整数

2 个答案: