“[object Object]”为什么我用这段代码得到它？答案

【问题标题】："[object Object]" Why do I get it with this code?“[object Object]”为什么我用这段代码得到它？
【发布时间】：2016-02-02 11:01:53
【问题描述】：

所以我通过 Google 和 Stackoverflow 进行了搜索，但对于我的生活，我似乎无法找到为什么我会收到带有此代码的“[object Object]”警告框。我根本不明白我为什么会这样。我的代码的哪一部分使该警报发生？

<script type="text/javascript" src="jquery.min.js"></script>
            <style>

            #circle{
                background-color: green;
                width:200px;
                height:200px;
                border-radius: 100px;
            }
            .square{
                background-color: red;
                width:300px;
                height:300px;
                margin-top: 10px;
            }
            </style>
            </head>
            <body>
            <div id="circle"></div>
            <div class="square"></div>
            <div class="square"></div>
            <script>
                $("div").click(function(){
                    alert($(this).css("width","400px"));
                });
            </script>
            </body>

【问题讨论】：

那你想提醒什么？
因为每个 jQuery 函数都返回他自己的实例（= 以“return this”结尾以便被链接。所以你的函数与 :alert(this) 或 this 是一个对象一样。所以你得到 [object Object]

标签： javascript jquery html css object

【解决方案1】：

jQuery css 方法被重载。

如果您向它传递一个参数，它是 CSS 属性的名称，那么它将返回 该属性的值。

如果你向它传递两个参数，它们是属性的名称和设置它的值，那么它将设置属性，然后返回jQuery对象 （这样你就可以链接进一步的方法调用了）。

当您将对象转换为字符串时，除非toString 已被覆盖，否则您将获得"[object Object]"。

简而言之：因为您是在设置数据而不是读取数据。

【讨论】：

我正要更新这篇文章，因为我意识到警报框由于数据设置而出现，并且删除警报或输入解决了问题。但是，您的回答是一个非常详细的解释，现在我理解得更好了，谢谢。

【解决方案2】：

如果您尝试console.log($(this).css("width","400px"))，您会看到它实际上会打印您...一个对象，一个jQuery 对象，因此您可以在其上链接方法。如果要在宽度更改后打印宽度，则必须这样做：

$("div").click(function(){
    alert($(this).css("width","400px").css("width"));
});

这将显示“400px”。

【讨论】：