javascript - 使用 jQuery 在页面上显示表格的宽度

Question

有时我会让最简单的 101 类问题困扰我!好了，是时候看最新章节了。 假设我有一个包含一个或多个表的 html 页面。我想使用 jQuery 显示找到的每个表格的宽度。

这是我的简单/基本表格 html -

 <table border="1" cellpadding="1" cellspacing="1" style="width: 500px;">
            <thead>
                <tr>
                    <th scope="col"></th>
                    <th scope="col"></th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td></td>
                    <td></td>
                </tr>
            </tbody>
        </table>
        <p>
        </p>
        <table border="1" cellpadding="1" cellspacing="1" style="width: 250px;">
            <tbody>
                <tr>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td></td>
                    <td></td>
                </tr>
            </tbody>
        </table>
        <p>
        </p>
        <table border="1" cellpadding="1" cellspacing="1" style="width: 500px;">
            <tbody>
                <tr>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td></td>
                    <td></td>
                </tr>
            </tbody>
        </table>

这是我正在使用的 jQuery -

    <script>
   $(document).on("pageshow", function () {          
          $("table:visible").each(function () {
        alert($(this).width);
    });
   });
   </script>

我正在使用 pageshow，因为这将是 jquery 移动网站的一部分，但它很容易成为标准的 jquery document.ready。

我确实收到了三次警报提示，但我没有得到当前表格的宽度(这个)。我收到类似这样的长消息 -

function (i,o){var a=arguments.length&&(r||"boolean"!=typeof i),s=r||(i===!0||o===!0?"margin":"border");return b.access(this,function(n,r,i){var o;return b.isWindow(n)?n.document.documentElement["client"+e]:9===n.nodeType?(o=n.documentElement,Math.max(n.body["scroll"+e],o["scroll"+e],n.body["offset"+e],o["offset"+e],o["client"+e])):i===t?b.css(n,r,s):b.style(n,r,i,s)},n,a?i:t,a,null)} 

那么我误解了什么明显的事情？

Answer 1

尝试下面的代码

$(document).on("pageshow", function () {          
    $("table:visible").each(function () {
        alert($(this).width());
    });
});