jQuery 选择器返回 null 而 DOM 函数工作得很好
Posted
技术标签:
【中文标题】jQuery 选择器返回 null 而 DOM 函数工作得很好【英文标题】：jQuery Selector returns null while DOM functions work just fine 【发布时间】：2018-04-05 10:57:24 【问题描述】：我需要使用 jQuery 选择器，但它返回 null。普通的、旧的 DOM 函数可以工作。我试图操纵这个：
<ul id="lhs_container">LI elements and html</ul>
这是我的测试代码：
$(document).ready(function()
if(document.getElementById("lhs_container"))
console.log("DOM was there"); //this is logged in the console
console.log($("#lhs_container").html()); //this blows up (error below)
);
我得到的错误是：
Uncaught TypeError: Cannot read property 'html' of null
at HTMLDocument
我也尝试过其他 jQuery 操纵器（追加等），它们都会导致错误。有谁知道是什么原因造成的？我正在拔头发！
【问题讨论】：
我不知道原因（没有足够的信息），但很明显，$ 没有在您的文档中准备好jQuery。 在该脚本声明之后，某些东西正在覆盖它。
jQuery() 永远不会返回 null。 jsfiddle.net/gcqy95ag 如果找不到元素，它将始终返回一个空的 jQuery 对象。所以正如 ^^^ 建议的那样，这似乎是说 $ 在你的情况下不是 jQuery。
@Karl-AndréGagnon 你是对的！这是一个“盒子里的应用程序”，允许通过 jQuery/javascript 进行自定义。他们有自己的 jQuery 库，但它没有及时加载我的脚本，所以我调用了我自己的库。他们的实现不支持 $，所以 $(document).ready() 正在工作，但是当它到达 $ 选择器时，另一个库已经加载并覆盖了。
【参考方案1】：
$(document).ready(function()
if(document.getElementById("lhs_container"))
console.log("DOM was there");
console.log($("#lhs_container").html());
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<ul id="lhs_container">LI elements and HTML</ul>
</body>
</html>我得到正确的输出。检查是否正确添加了 jquery 库。
【讨论】：
以上是关于jQuery 选择器返回 null 而 DOM 函数工作得很好的主要内容，如果未能解决你的问题，请参考以下文章