Javascript If/Else语句检查内容：url

我在找出正确的语法以让代码检查一个id为“#main”的图像的值方面遇到了问题。我的CSS让图像基于使用content:url属性的媒体查询更改其src。我这样做的原因是因为我有大约5个不同的背景图像，它们以不同的宽度触发，为我的内容提供一个框架，我需要能够根据当前用作框架的图像调整“.text”div的高度

我了解如何编写所有这些代码，我所需要的只是帮助我如何在第一个代码上正确地请求值，我应该能够从那里完成其余的工作。再一次澄清一下，问题在if/else声明中；代码在没有if/else语句的情况下工作

以下是我所拥有的：

function updateHeight()
{

if ($("#main").css('content') === 'url("../images/main-bg2-landscape.png")') {

    var div = $('.text');
    var width = div.width();

    div.css('height', width *.57);}
}

以下是CSS的一个示例：

#main {z-index: -1;
       position: absolute;}

.text {position: absolute;
       background-color: #FFFFFF;
       background-position: top;
       left: 11%;
       width: 78%;
       margin-top: 19%;
       opacity: .4;}

@media only screen and (min-width: 1025px) {

     #main {content:url(../images/main-bg2-landscape.png);}

     .text {position: absolute;
       background-color: #FFFFFF;
       background-position: top;
       left: 11%;
       width: 78%;
       margin-top: 19%;
       opacity: .4;}
}

---

谢谢

问题很可能是css中的“url（）”调用将导致最终呈现的HTML中图像的完整路径。它将不是您在.css文件中放置的相对路径

在本例中，可能类似于/images/main-bg2-landscape.png。如果您在chrome或您选择的浏览器中检查图像元素，您将看到最终出现在HTML中的完整路径

更好的选择可能是仅对文件名进行比较，这样您就不必依赖于图像的位置。比如：

if ($("#main").css('content').indexOf("main-bg2-landscape.png") !=-1) {

var div = $('.text');
var width = div.width();

div.css('height', width *.57);}

---

}

到目前为止还不错，你的代码运行得很好，但如果你不介意的话，我对javascript不太精通。你能解释一下索引的确切含义吗-我到底做了什么？indexOf基本上是在字符串中搜索图像文件名的那一部分吗，-1与我在上面的z索引有关吗？Thanks@G4MOOSE-indexOf只是一个字符串是否包含子字符串的javascript版本。详情如下：