jquery 选择器不起作用,为什么?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12158457/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery selector not working, why?
提问by user961627
I simply want to manipulate the elements within the #content div, but $('#content')
doesn't seem to work, and yet in other places it does! My relevant code is very simple:
我只是想操纵 #content div 中的元素,但$('#content')
似乎不起作用,但在其他地方却起作用了!我的相关代码非常简单:
HTML
HTML
<body>
<input type='button' value='Save design' id='save' />
<div id="content" style="height: 200px; width:600px;border: 1px solid black;" class='whatev'></div>
</body>
Script
脚本
$(document).ready(function(){
$('#save').click(function(e){
alert( document.getElementById('content').id); // this works!
alert($("#content").length); // this works! it outputs "1"
alert($("#content").id); // this does NOT work - undefined, why?
//end save function
});
$('#content').click(function(e){
// do stuff // ALL of this works!
});
});
That is it. If you notice, it does work in some places (the entire click function bound to it is perfectly fine), but where it doesn't work, it strangely does still exist because length = 1
. I tried using context as well to search the div, just in case, (using $('#content','body')
), but no use.
这就对了。如果您注意到,它在某些地方确实有效(绑定到它的整个点击功能都很好),但在它不起作用的地方,奇怪的是它仍然存在,因为length = 1
. 我也尝试使用上下文来搜索 div,以防万一,(使用$('#content','body')
),但没有用。
回答by lonesomeday
There is a difference between a DOM element and a jQuery selection that contains a DOM element. A jQuery selection is a wrapper around the DOM object to make it easier to use. It doesn't have an id
property, but a DOM element does. On the other hand, jQuery does provide a way to access elements' properties using the attr
method:
DOM 元素与包含 DOM 元素的 jQuery 选择之间存在差异。jQuery 选择是围绕 DOM 对象的包装器,以使其更易于使用。它没有id
属性,但 DOM 元素有。另一方面,jQuery 确实提供了一种使用以下attr
方法访问元素属性的方法:
document.getElementById('content').id // access the id property of a DOM element
$('#content').attr('id') // use jQuery to select the element and access the property
The length
property, however, is provided by a jQuery selection, which is why that works fine for you.
length
但是,该属性是由 jQuery 选择提供的,这就是为什么它适合您的原因。
回答by adeneo
id
is a plain DOM property/attribute, and works with plain DOM objects, not jQuery objects.
id
是一个普通的 DOM 属性/属性,适用于普通的 DOM 对象,而不是 jQuery 对象。
You would do this in jQuery:
你会在 jQuery 中做到这一点:
$("#content").attr('id');
which equals:
这等于:
document.getElementById('content').id
or
或者
$("#content")[0].id; //[0] gets the first DOM object in the collection
回答by Shyju
Try this
尝试这个
$("#content").attr("id")
回答by JAAulde
$("#content")
returns the jQuery collection containing the elmenent with id content
. id
is an attribute of an element, not a property of the collection. You would get the element's ID by chaining the attr()
method off the collection:
$("#content")
返回包含 id 元素的 jQuery 集合content
。id
是元素的属性,而不是集合的属性。您可以通过将attr()
方法链接到集合中来获取元素的 ID :
alert($("#content").attr('id'));
Or, when each
ing the collection, inside the function passed to each
this
will be the actual element, so you could access this.id
或者,当each
ing 集合时,传递给的函数内部each
this
将是实际元素,因此您可以访问this.id
$("#content").each(function () {alert(this.id);});
回答by jeffery_the_wind
For this question you should go straight to jsfiddle, and to the jquery docs for how to get attributes of html elements -> http://api.jquery.com/attr/.
对于这个问题,您应该直接转到 jsfiddle,然后转到 jquery 文档以了解如何获取 html 元素的属性 -> http://api.jquery.com/attr/。
The jQuery selector object itself doesn't have an attribute id
. You have to use .attr('id')
function.
jQuery 选择器对象本身没有属性id
。你必须使用.attr('id')
函数。
I fixed that and everything else works, as you see in this jsfiddle: http://jsfiddle.net/AdtrX/1/
我修复了这个问题,其他一切正常,正如你在这个 jsfiddle 中看到的:http: //jsfiddle.net/AdtrX/1/
回答by AdityaParab
Always remember!
总记得!
In jQuery when you want to access some attribute
of the selected element, you use jQuery
's
.attr()
API.
在 jQuery 中,当您想要访问某些attribute
选定元素时,您可以使用jQuery
的
.attr()
API。
Now you said this,
document.getElementById("content").id
Works,
Equivalent jQuery
statement of this line is
现在你说这个,
document.getElementById("content").id
Works,jQuery
这行的等效语句是
$("#content").attr('id');
$("#content").attr('id');
For selecting attribute use .attr()
For manipulating style/css use .css()
用于选择属性使用.attr()
用于操作样式/css 使用.css()
YOu can also alter CSS properties of the selected element using .attr()
您还可以使用更改所选元素的 CSS 属性 .attr()
Like .attr('style','your new style');
喜欢 .attr('style','your new style');
回答by Sunil Marwaha
you can get id by by using .attr("id") function. Use this code: $("#content").attr("id");
您可以使用 .attr("id") 函数获取 id。使用此代码: $("#content").attr("id");
回答by Basheer AL-MOMANI
what led me to this page is
是什么让我来到这个页面
I have this div with id LING_a_00224.s03
我有这个带有 id 的 div LING_a_00224.s03
<div id="LING_a_00224.s03" ></div>
and when I use jquery selector to get it
当我使用 jquery 选择器来获取它时
$("#LING_a_00224.s03")
I got not element
(jquery selector not working)
我得到了not element
(jquery 选择器不起作用)
thats because the dot (.)
in the id
那是因为dot (.)
在the id
jquery will interpret
it as All elements with id="LING_a_00224" and class="s03"
, not All elements with id="LING_a_00224.s03"
jquery 将interpret
它作为所有元素id="LING_a_00224" and class="s03"
,而不是所有元素id="LING_a_00224.s03"
so make sure that id selector does not contains jquery selector symbols like (
.
)
所以请确保 id 选择器不包含像 (
.
)这样的 jquery 选择器符号
or
if you don't have control
over elements ids
, you can do
或者如果你don't have control
在元素上 ids
,你可以做
selector=document.getElementById("LING_a_00224.s03");//JQuery selector sometimes fails because id may contains dot on it like #fn12.e2e
$(selector).jqueryFunction()// wrap the JavaScript object into $() to convert it to jquery object
hope this helps you
希望这对你有帮助