javascript - 根据页面标题更改图像

标签 javascript jquery

我想做的是根据页面标题,正文中的图像会发生变化。例如,如果页面标题是“我们爱苹果”,则正文中的图像将是一个苹果。如果标题包含其他水果,则会显示其他水果。如果页面标题不包含脚本正在查找的任何单词,则正文中将有一个默认图像。

我确实从 http://www.codingforums.com/archive/index.php/t-218600.html 找到了这个脚本但我似乎无法让它发挥作用。

有人有任何提示或指示吗?感谢您的帮助!

<!doctype html>
<html>
<title>2image</title>
<head>
</head>
<body>

<div><img src="" alt="anImageDesc" name="myimage" width="50px" height="50px" id="someImage" />
</div>

<script type="text/javascript">
var imgs = [
"http://www.domain.com/images/image_255 Company_Name.jpg",
"http://www.domain.com/images/image_256 Company_Name.jpg",
"http://www.domain.com/images/image_257 Company_Name.jpg" //no comma after last image
];
var el = document.getElementById("someImage");
var title = document.title;
for (var i=0;i<imgs.length;i++){
if (imgs[i].indexOf(title) != -1) { 
el.src = imgs[i];
break;  
} else {el.src = "image_256.gif"} //a default image incase nothing is found
}
</script>

</body>
</html>

最佳答案

请参阅: DEMO

我建议在标题中查找标记的键/值映射,并将适当的图像与该标记相关联:

var images = {
    'very large apple' : 'http://www.domain.com/images/very_large_apple_image_here.jpg',
    'large apple' : 'http://www.domain.com/images/large_apple_image_here.jpg',
    'apple' : 'http://www.domain.com/images/apple_image_here.jpg',
    'orange' : 'http://www.domain.com/images/orange_image_here.jpg'
};

var defaultImage = images['apple']; //Set your default here.
var imageElement = document.getElementById("someImage");
var title = document.title.toLowerCase();
var source = null;

for (var t in images) {
    if (title.indexOf(t.toLowerCase()) != -1) {
        source = images[t]; //Found a match.
        break;
    }
}

if (!source) source = defaultImage;

imageElement.src = source;

关于javascript - 根据页面标题更改图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18726027/

相关文章:

javascript - If...else 基于从字符串中随机选择

jQuery:在 $.proxy 内查找左侧偏移量

javascript - 使用 js 将 img 转换为灰度面临安全错误

javascript - 展开和折叠,以 anchor 链接为目标

javascript - PhantomJS open() 太慢

javascript - 为什么 alert() 中断代码执行?

javascript - 如何将数据发送到我的服务器并让它以文件形式返回

javascript - HTML 音乐播放器 - 绝对文件位置(即 C :\song. mp3)

javascript - 单击其他菜单项时隐藏当前子菜单

javascript - 什么鼠标事件?