Javascript 隐藏一个容器而不隐藏所有容器

如果缺少配置文件图像，则需要隐藏整个

，但允许显示相同类的剩余

。我的JSFIDLE似乎很接近，但有人能检查我的工作吗

我的工作还需要在封闭系统（Springshare/LibGuides）的CSS/JS页面中进行，这意味着我不能添加任何内联调用等

$（（）=>{
var src=$（'img'）.attr（'src'）；
if（src=='//libapps.s3.amazonaws.com/apps/common/images/profile.jpg'）{
$（'.s-lib-featured-profile-container'）.hide（）；
} 
否则{
$（'.s-lib-featured-profile-container'）.show（）；
}
})

---

您需要循环包含所需图像的所有div。请注意，浏览器将当前方案添加到以

/

开头的URL中，因此您可以使用类似于

的
结尾搜索


$（（）=>{
$（“.s-lib-featured-profile-container”）。每个（（索引，容器）=>{
var src=$（container.find（'img'）.prop（'src'）；
console.log（src）；
如果（src=='https://libapps.s3.amazonaws.com/apps/common/images/profile.jpg') {
$（container.hide（）；
}
})
})
如果选择了所有图像并将其隐藏，则需要迭代图像，然后针对每个图像决定是否隐藏


$（（）=>{
var allItems=$（'.s-lib-featured-profile-container'）；
allItems.each（函数（）{
var image=$（this.find（'img'）；
if（image&&image.attr（'src'）=='//libapps.s3.amazonaws.com/apps/common/images/profile.jpg'））{
$（this.hide（）；
}
});
})
img{
宽度：100px；
}

您可以使用JQuery方法筛选出那些具有默认图片的图像的图像容器，而不是使用。然后简单地用鼠标隐藏它们

代码：

带注释的代码：

为什么要在每个
上使用
过滤器
？
Filter
应用了使代码更具可读性和可扩展性的附加好处。将来，如果您查看代码，就会知道它是在过滤，而不仅仅是在列表上迭代

filter
是否优于
每种
？
这是有争议的。使用
each
可以在列表上迭代
一次
并隐藏元素。当
过滤器
/
隐藏
方法迭代，然后隐藏每个元素，有效地再次迭代时，这显然更有效。尽管如此，性能差异很可能可以忽略不计。使用
filter
的好处在于更高的代码健全性，但是
每一个
都没有被删除，因此这是一个错误的选择

基本上

由您自行决定


代码段：

$（（）=>{
带有默认配置文件=$（“.s-lib-featured-profile-image”）的变量
.filter（函数（）{
返回$（this.find（“img”）.attr（“src”）==“//libapps.s3.amazonaws.com/apps/common/images/profile.jpg”；
})
使用_default_profile.hide（）；
})

“最终，使用img&src调用代码”你这是什么意思？html标记如何调用代码？我也不知道如果图像丢失，它将如何隐藏。您只是在检查图像上的src等于多少。@dustytrash我相信这是默认的配置文件图像，OP只想展示用户提供的图像。因此，请选择每个图像，然后在其上循环。查看其来源，然后选择父级。当前，您选择所有图像，查看第一个图像的来源，然后选择所有
s-lib-featured-profile-container
，并将其作为一个组进行更改。是的，@zfrisch是正确的。我意识到逗号可能有助于我的描述！隐藏默认配置文件图像，并显示用户上载图像的“div/containers”。这就做到了！谢谢你，塔哈！不客气，但要点不是直接复制粘贴它，而是试着理解代码的作用。我确实看到了区别，以及附加的行循环，并用初始类检查每个div，看看它们是否包含概要文件映像src。我绝对是一个前端和用户体验设计师，只知道足够的后端语言来犯一些愚蠢的错误！再次感谢！
var with_default_profile = $(".s-lib-featured-profile-image")
  .filter(function() {
    return $(this).find("img")
    .attr("src") === "//libapps.s3.amazonaws.com/apps/common/images/profile.jpg";
  })
  with_default_profile.hide();

// grab all the image containers

var with_default_profile = $(".s-lib-featured-profile-image")

// filter the image containers by asking
// does this container have an img with src ".../jpg" ?

  .filter(function() {
    return $(this).find("img")
    .attr("src") === "//libapps.s3.amazonaws.com/apps/common/images/profile.jpg";
  })

// hide all the images that answered the question with "yes".

  with_default_profile.hide();