jquery - 如何在具有特定属性值的 iframe 的单击元素上应用 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 = 填充的第一个元素”上应用一个类，那么您应该这样做

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

编辑：如果单击的元素具有正确的数据类型，您还想匹配它，那么我建议

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