如何在具有特定属性值的iframe的clicked元素上应用css类？

Question

获取iframe的内容后,将其过滤以获取具有自定义属性的第一个元素data-type = filled.但是我无法在该特定元素上应用类.

这是我的代码:

var clicked_content = event.target.outerHTML, // gives the content being clicked

content = $(clicked_content).find("*[data-type='filled']:first").andSelf().html(); // this gives me the required content

// this was supposed to add a class to particular element
content.parent.addClass("highlight");

我也试过这样做:

$(event.target).children().find("*[data-type='filled']:first").andSelf().addClass('highlight');

Answer 1

outerHTML并html()返回字符串.字符串没有父级.

也许你想要

$(event.target).find("*[data-type='filled']:first").andSelf()
    .parent().addClass("highlight");

请注意,andSelf已被弃用并替换为addBack.

如果您尝试在"具有自定义属性data-type = filled"的第一个元素上应用类,那么您应该这样做

$(event.target).find('[data-type=filled]').eq(0).addClass("highlight");

编辑:如果你想要匹配点击的元素,如果它有适当的数据类型,我建议

$(event.target).find('*').addBack().filter('[data-type=filled]').eq(0)
   .addClass("highlight");