删除 if 元素具有特定的数据值 jquery

Question

预期

单击button时，我希望它提醒数据类型值

.HTML

<ul id="threads">
<li data-href='q' data-type='m'>abc <button>Click</button></li>
<li data-href='q' data-type='t'>mnp <button>Click</button></li>
<li data-href='r' data-type='t'>rst <button>Click</button></li>
</ul>

简讯

$(document).on("click","button",function(){

var  element = $(document).find("div").find("[data-href='q']");
if(element....has data-type='m'?){alert("this is m type"); }
if(element....has data-type='t'?){alert("this is t type"); }

})

这比预期的要花我更多的时间，有人知道要走的路吗？

Answer 1

$(document).ready(function(){
	$("#threads button").click(function(){
		var datatype = $(this).parent().attr("data-type");
		if(datatype == 'm'){
			alert(datatype);
		}else{
			alert(datatype);
		}
	});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<ul id="threads">
<li data-href='q' data-type='m'>abc <button>Click</button></li>
<li data-href='q' data-type='t'>mnp <button>Click</button></li>
<li data-href='r' data-type='t'>rst <button>Click</button></li>
</ul>

我认为这种方法会对你有很大帮助

Answer 2

$("#threads li[data-href='q'][data-type='m']").remove();

Answer 3

$('#threads').find('li').filter("[data-href='q'][data-type='m']").remove();

通过 id 查找父级，找到嵌套的 lis，然后过滤那些同时具有 q 和 m 的，并删除它们/it。

至于为什么我将选择器分成三个步骤，您可以参考 http://learn.jquery.com/performance/optimize-selectors/以获取更多阅读。

这是使用条件的替代版本。

var $threadItems = $('#threads').find('li');
$threadItems.each(function(index, item){
var $item = $(item);
if ($item.data('href') === 'q') {
if ($item.data('type') === 'm') {
$item.remove();
}
}
});