谷歌Chrome开发者工具在控制台中与Jquery一起出现问题

Question

当我尝试在Google Chrome的开发者工具中执行以下JQuery代码时

$("#u_16_0").val("AJ College, Sivakasi")

我得到以下错误:

未捕获错误:<[EX [["尝试获取id为\"%s \"的元素,但页面上不存在.","#u_16_0"]]]>(...)h @ LGuPoDEwQGD.js: 36i @ LGuPoDEwQGD.js:36(匿名函数)@ VM580:1

有人可以帮我解决这个问题吗？我已经验证该元素存在于页面中.我的意思是如果我只是输入$("#u_16_0")控制台,就会打印元素.

请参阅以下链接,其中包含我的Google Chrome版本信息的屏幕截图.

[

更新 - 1

我设法用下面的普通javascript代码完成了这个

document.getElementById("u_16_0").value="University of Cambridge"

更新 - 2

Amin基于jQuery的答案也奏效了.因此,接受它作为答案并授予赏金.

Answer 1

注意:不要指望$总是JQuery.

Chrome控制台似乎无法访问内容脚本的执行上下文.

错了,确实如此.你需要看看正确的地方:

<page context>您必须选择,而不是动画中的下方chrome-extension://<your extension id>

您可以在您的Chrome版本中单击下方的"顶部".

之前的截屏视频显示,Chrome开发者工具的控制台选项卡底部有两个下拉框,可用于更改开发人员工具控制台的执行环境.
左侧可用于更改帧上下文(顶部框架,因此iframe,...),右侧可用于更改脚本上下文(页面,内容脚本,...).

参考:为什么jQuery不会加载到Facebook？

Answer 2

问题是当你假设它$总是jQuery而它不是.简单的方法来查看它是否console.log($)并查看它返回的内容.

jQuery通常会返回

function (selector,context){return new jQuery.fn.init(selector,context)}

要么

function (a,b){return new n.fn.init(a,b)}

现在任何人都可以定义$为任何东西.在Facebook上,它似乎是一个别名,document.getElementById()并在其中进行了一些检查

function i(j){return h(j);}

running $("contentCol")将返回一个DOM元素.

如果$没有定义,在Chrome开发工具中,它是别名document.querySelector

$(selector, [startNode]) { [Command Line API] }

所以最后,不要指望$是jQuery.

Answer 3

这是因为 jQuery$符号与其他库（例如某些 facebook js 库）发生冲突。你应该使用jQuery而不是$：

jQuery("#u_16_0").val("AJ College, Sivakasi");