javascript - jquery 选择器和 js 选择器有什么区别？

Question

一个菜鸟的简单问题。这些变量之间有区别吗？

var object1 = document.getElementById('myElement');
var object2 = $('#myElement');

此外，我可以在 object2 上运行普通的 js 东西吗？例如，如果 #myElement 是 <textarea>我能做吗:

object2.value = "fill in with this text";

或者，我必须这样做:

$(object2).val('fill in with this text');

或者，还有更好的方法吗？

Answer 1

var object1 = document.getElementById('myElement');

您从这个调用中获得了一个 DOM 元素对象。因此，您可以使用 value 属性为其赋值。

object1.value = "text";

---

var object2 = $('#myElement');

你从这个调用中得到一个 jQuery 对象。 jQuery 对象内部是一个 DOM 对象。将 jQuery 对象视为 DOM 对象的包装器。从图表上看，它看起来像这样(简化):

jQuery ------------------+
|                        |
| Array ---------------+ |
| |                    | |
| | HTMLElement------+ | |
| | |                | | |
| | | DOM properties | | |
| | | DOM element    | | |
| | |     methods    | | |
| | |                | | |
| | +----------------+ | |
| | there may be zero, | |
| | one or more such   | |
| | objects inside     | |
| +--------------------+ |
| jQuery properties      |
| jQuery methods         |
|                        |
+------------------------+

由于 object2 是一个 jQuery 对象，您可以使用 val() 函数为其赋值。您不能使用 value 属性，因为它与 DOM 对象不同。

object2.val("text");

就像其他答案所说的那样，您可以使用数组解引用 (object2[0]) 或 get() 函数，然后使用 value 给它一个值。