JS：根据页面URL获取图片

请原谅我的无知;我是一个HTML家伙，JS对我来说非常陌生。我试图创建一个功能，可以显示基于页面URL的图像。JS：根据页面URL获取图片

例如： “page_001-e.html” 将显示 “page_001.jpg”

我已经设法到目前为止一起杀猪这一点。

<script type="text/javascript"> 
    document.write("<img src=\"photos/full/"+location.pathname.substring(location.pathname.lastIndexOf("/") + 1)+".jpg"+"\" />"); 
</script>

将返回：

<img url="photo_000-e.html.jpg" />

我需要从结果修剪-e.html。我在一个多语言网站工作，所以我不能依靠-e作为一个常数，因为它是语言指标。

从谷歌搜索，它看起来像我可以使用str.replace或可能slice但我不知道如何使用它们或从哪里去。

我很感激任何帮助，或任何建议，如果我看着这个错误的方式。

来源

2013-12-09 steelfrog

你可以得到的URL像下面的代码，假设总是会有一个破折号：

<script type="text/javascript"> 
    var img_url = window.location.href.split("-")[0] + ".jpg"; 
</script>

现在，你需要找出你想放置的位置。我建议制作一个Image对象，然后将其附加到DOM中的特定区域。

<script type="text/javascript"> 
    // Get the image URL 
    var img_url = window.location.href.split("-")[0] + ".jpg"; 

    // Create an image (not visible anywhere) 
    var img = document.createElement("img"); 

    // Set the Image to load from your new URL 
    img.src = image_url; 

    // Add it to your HTML 
    document.getElementById("some_id").appendChild(img); 
</script> 

<div id="some_id"> 
</div>

在上面的代码中，javascript会将图像添加到ID为“some_id”的div中。

来源

2013-12-09 19:01:19

完美。我稍微修改了一下，并让它起作用！非常感谢！ – steelfrog

您可以使用下面的代码来修剪值

location.pathname.substring(location.pathname.lastIndexOf("/") + 1).replace(location.pathname.substring(location.pathname.lastIndexOf("/") + 1).lastIndexOf("-"),"")

来源

2013-12-09 18:58:49 Durai

尝试使用.replace？

var path = location.pathname.replace('.html','.jpg'); 

document.write(path);

来源

2013-12-09 19:03:30

这并不回答他的问题。他的图像示例没有“-e”（语言指示符），但只是替换文件扩展名将保留“-e”。 –

我的不好，你是对的！你的答案更好;） –

JS：根据页面URL获取图片

回答

相关问题