<div id="test"></div>
<script>
$(document).ready(function() {
alert($('#test').id);
});
</script>
为什么上面的方法不起作用,我应该怎么做?
<div id="test"></div>
<script>
$(document).ready(function() {
alert($('#test').id);
});
</script>
为什么上面的方法不起作用,我应该怎么做?
当前回答
$('#test')返回一个jQuery对象,因此不能简单地使用object.id获取其id
您需要使用$('#test').attr('id'),它返回元素所需的id
这也可以如下进行,
$('#test').get(0).id,等于document.getElementById('test').id
其他回答
jQuery方法:
$('#test').attr('id')
在您的示例中:
$(文档).ready(函数){console.log($('#test').attr('id'));});<script src=“https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js“></script><div id=“test”></div>
或者通过DOM:
$('#test').get(0).id;
或甚至:
$('#test')[0].id;
在JQuery中使用$(“#test”).get(0)或甚至$(“#test”)[0]的原因是$(“#test”)是JQuery选择器,并返回结果的array(),而不是其默认功能中的单个元素
jquery中DOM选择器的另一种选择是
$('#test').prop('id')
它不同于.attr()和$('#test').prop('o')获取指定的DOM foo属性,而$('#test').attr“'o'”获取指定的HTML foo属性。
$('#test').attr('id')在您的示例中:
<div id="test"></div>
$(document).ready(function() {
alert($('#test').attr('id'));
});
如果您想获取一个元素的ID,比如说通过类选择器,当在该特定元素上触发事件(在本例中为单击事件)时,以下操作将完成此任务:
$('.your-selector').click(function(){
var id = $(this).attr('id');
});
这可以是元素id、类,也可以自动使用
------------------------
$(this).attr('id');
=========================
------------------------
$("a.remove[data-id='2']").attr('id');
=========================
------------------------
$("#abc1'").attr('id');
=========================
这将最终解决您的问题:
假设您在一个页面上有多个按钮,您希望根据其ID使用jQueryAjax(或不是Ajax)更改其中一个按钮。
还可以说,您有许多不同类型的按钮(用于表单、审批和类似目的),您希望jQuery只处理“类似”按钮。
这是一个有效的代码:jQuery将只处理.cls-hlpb类的按钮,它将获取所单击按钮的id并将根据来自ajax的数据进行更改。
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"> </script>
<script>
$(document).ready(function(){
$(".clshlpbtn").on('click',function(e){
var id = $(e.target).attr('id');
alert("The id of the button that was clicked: "+id);
$.post("demo_test_post.asp",
{
name: "Donald Duck",
city: "Duckburg"
},
function(data,status){
//parsing the data should come here:
//var obj = jQuery.parseJSON(data);
//$("#"+id).val(obj.name);
//etc.
if (id=="btnhlp-1")
$("#"+id).attr("style","color:red");
$("#"+id).val(data);
});
});
});
</script>
</head>
<body>
<input type="button" class="clshlpbtn" id="btnhlp-1" value="first btn"> </input>
<br />
<input type="button" class="clshlpbtn" id="btnhlp-2" value="second btn"> </input>
<br />
<input type="button" class="clshlpbtn" id="btnhlp-9" value="ninth btn"> </input>
</body>
</html>
代码取自w3schools并进行了修改。