这两个javascript和jquery语句有什么区别?

谢谢大家的帖子。这是一个简单的问题,但有一个微妙的问题,我(显然还有其他几个)错过了…jquery选择器将返回元素集合,而不是唯一的dom元素。谢谢@adrian的回答。

是的,看起来也可以使用.val()而不是.value。不过,我确实觉得这很奇怪,因为它似乎与第一个答案不符(因为它不要求我指定集合中的哪个元素),但无论如何,它仍然有效,并且为该元素提供了html“value”属性(在本例中,是在文本框中键入的名字)。

$("#FirstName") 

是纯javascript代码的jquery简写代码

document.getElementById("FirstName")

为了使用这两个代码获取元素的值,jquery使用 '.val()'

前任。

$('#FirstName').val();

而纯javascript代码使用 '值'

前任。

document.getElementById("FirstName").value;

总而言之:

$('').val(); 

等于

document.getElementById('').value;

$ (or jQuery()) 是一个jquery函数,它包装搜索的对象(由选择器),因此,返回的对象没有 value 属性,但提供实用程序方法以获取等效项。
见 .val() 在里面 http://api.jquery.com/category/manipulation/general-attributes/

document.getElementByID返回一个具有传入字符串ID的DOM对象。$(cssseelector)返回一个jquery对象,该对象包含一组与css选择器匹配的dom对象,在您的情况下,是具有id firstname的dom对象。

如果要直接访问value属性,则需要通过集合中的第一个dom对象或jquery方法val进行访问。

// Use the jQuery val function
console.log ($("#FirstName").val());

// Or get the first element and look at the value property
console.log ($("#FirstName")[0].value);

console.log(document.getElementById('FirstName').value);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="FirstName" class="TabInput" value="'. $ListRow[3] . '">

jquery不使用 .value . 它使用 .val()

这就是为什么它给了你未定义的

然而,javascript确实使用 .value 这就是为什么它给了你正确的答案。

javascript

document.getElementById("submit").addEventListener("click", function() {
  console.log(document.getElementById("text").value);
});

<input type="text" id="text" />
<button id="submit">Submit</button>

JQuery

$("#submit").click(function() {
  console.log($("#text").val());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="text" />
<button id="submit">Submit</button>