为什么 Jquery $(#); 不工作，但 Javascript document.getElementById 工作正常吗？

Question

我在 Javascript 中有一组功能齐全的代码，带有“document.getElementById”。 但是当我将其更改为 Jquery 时，它不起作用（并且没有错误）。

<!DOCTYPE html>
<html>
<head>
<style></style>
<script src="jquery-3.3.1.min.js"></script>
<script language="javascript">
    function formChk(){
    var success=true;
    var types = ["Western","Chinese","Local","Beverage"];
    var nameTxtBox=$("#name"); <!--This doesn't work-->
    var picturesTxtBox=document.getElementById("pictures"); <!--This works fine-->

对应的 id="name" 和 id="pictures" 代码如下：

<p><input type="text" id="name" name="name"></p>
<p><input type="text" id="pictures" name="pictures"></p>

控制台中没有错误消息。 但是，代码没有按预期运行。 整个代码应该执行表单验证检查 - 如果用户输入为空，它应该抛出错误消息。 但是，当我将“getElementById”更改为 JQuery $(#); 时，表单验证不起作用。

为什么会出现这种情况？？ 不是 $(#); 完全等同于 document.getElementById？

Answer 1

不是 $(#); 完全等同于 document.getElementById？

绝对不是，它们返回非常不同的元素， jQuery返回一个

基于传递的参数在 DOM 中找到或通过传递 HTML 字符串创建的匹配元素的集合。

Jquery() 文档

虽然document.getElementById()返回

描述与指定 ID 匹配的 DOM 元素对象的 Element 对象，如果在文档中找不到匹配的元素，则为 null。

document.getElementById() 文档

如果为了与之前的代码兼容，必须从 jQuery 集合访问 Element 对象，则可以使用数组表示法。

所以如果选择器匹配单个元素，比如一个 id，你可以这样做

let el = $('#selector')[0];

模仿document.getElementById()的行为。

Answer 2

$("#name")返回一个 jQuery 对象而不是一个 Element 对象，如document.getElementById("pictures"); 要返回一个 Element 对象，您需要从 jQuery 对象中获取 Element 对象

$("#name")[0]

Answer 3

如果你想获得#name 的值，那就是

$("#name").val()

Answer 4

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

我们必须在 val() 中传递值。

为什么 Jquery $(#); 不工作，但 Javascript document.getElementById 工作正常吗？

问题描述

4 个解决方案

解决方案1
4 2019-02-01 11:34:12

解决方案2
1 已采纳 2019-02-01 11:28:22

解决方案3
0 2019-02-01 11:24:41

解决方案4
0 2020-03-06 10:30:09

为什么 Jquery $(#); 不工作，但 Javascript document.getElementById 工作正常吗？

问题描述

4 个解决方案

解决方案1 4 2019-02-01 11:34:12

解决方案2 1 已采纳 2019-02-01 11:28:22

解决方案3 0 2019-02-01 11:24:41

解决方案4 0 2020-03-06 10:30:09

解决方案1
4 2019-02-01 11:34:12

解决方案2
1 已采纳 2019-02-01 11:28:22

解决方案3
0 2019-02-01 11:24:41

解决方案4
0 2020-03-06 10:30:09