gpt4 book ai didi

javascript - 如何使用 jQuery 和 IE7 检查附加的 src 属性是相对的还是绝对的?

转载 作者:行者123 更新时间:2023-11-28 02:17:28 25 4
gpt4 key购买 nike

我有一个包含代码的网站:

<html>
<head>
</head>
<body>
<div id="wrap">
<img id="img_1" src="images/sample.gif" alt="Image 1" width="200" height="40" />
</div>
</body>
</html>

我有这个 JavaScript 和 jQuery:

$(document).ready(function(){
$('#wrap').append('<img id="img_2" src="images/sample_2.gif" alt="Image 2" width="200" height="40" />');

alert($('#img_1').attr('src'));
alert($('#img_2').attr('src'));
});

在 IE7 中,

第一个警报显示:'images/sample.gif'

第二个警报显示:' http://hostname/images/sample_2.gif '

有解决办法吗?

我正在做的是通过 JSONP 从不同服务器上的网站引入标题并将其附加到当前页面。 header 包含一些 img 标签的相对路径,所以我想有选择地检查它们是否确实是相对的,并在远程服务器主机名前添加,以便它们正确显示。

由于这个问题,该功能适用​​于除 IE7 以外的所有浏览器。

--

再做一些工作之后。我有这个 JavaScript:

<script type="text/javascript">
$(document).ready(function(){
function Config(){}
Config.Framework = {
RemoteRoot: "http://remote-root.com/",
RemoteHostName: "remote-root.com",
LocalHostName: window.location.hostname
};

$('#wrap').append('<img id="img_2" src="images/logo.gif" alt="Logo" width="100" height="93" />');
$('#wrap').append('<img id="img_3" alt="Logo" width="100" height="93" />');
$('#img_3').attr("src", "images/logo.gif");

$('img', '#wrap').each(function(i){
set_src($(this));
alert(i + ': ' + $(this).attr('src'))
});

function set_src(img) {
var src = img.attr('src');

if ($.inArray(Config.Framework.LocalHostName, src) > -1) {
img.attr('src', src.replace(Config.Framework.LocalHostName, Config.Framework.RemoteHostName));
} else {
img.attr('src', Config.Framework.RemoteRoot + src);
}
}
});
</script>

因此 set_src 函数检查本地主机名是否在 src 字符串中,如果是,我将其替换为远程主机名。如果拉入图像的页面位于根文件夹中,这很好。但很多时候并非如此。

如果图片被拉到一个不在根目录下的页面,它会设置src为(仅在IE7中):

如果在根目录中,它会:

如果在根目录之外:

最佳答案

如果像下面的代码一样在 jQuery 中添加图像,您将获得相对 url,因此您不需要检查它,因为您的所有图像都将与 relateve url 链接:

<script type="text/javascript">
$(document).ready(function(){
$('#wrap').append('<img id="img_2" alt="Image 2" width="200" height="40" />');
$('#img_2').attr("src","images/sample_2.gif");

alert($('#img_1').attr('src'));
alert($('#img_2').attr('src'));
});
</script>

或者您可以检查 src 是否包含“http”:

alert($('#img_2').attr('src').indexOf("http"));

更新:

我已经修改了你的代码。它依赖于图像将位于 "image" 文件夹中。

function set_src(img) {
var src = img.attr('src');
alert(src);
alert(src.indexOf('images/'));
if (src.indexOf('/images/') > -1) {
img.attr('src', src.replace(src.substring(0, src.indexOf('/images/') + 1), Config.Framework.RemoteRoot));
//img.attr('src', src.replace(Config.Framework.LocalHostName, Config.Framework.RemoteHostName));
} else {
img.attr('src', Config.Framework.RemoteRoot + src);
}
alert(img.attr('src'));
}

关于javascript - 如何使用 jQuery 和 IE7 检查附加的 <img/> src 属性是相对的还是绝对的?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3105259/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com