给定以下代码
var cities = {
barcelona: {
name: "Barcelona",
color: "#F75C03",
image: "barcelona.jpeg",
description: `
Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Phasellus egestas tellus rutrum tellus pellentesque eu tincidunt tortor.
Nisl pretium fusce id velit. Tellus mauris a diam maecenas sed enim ut sem.
Auctor urna nunc id cursus metus aliquam eleifend. Habitasse platea dictumst quisque sagittis purus.
Feugiat scelerisque varius morbi enim nunc faucibus a pellentesque sit.
Platea dictumst quisque sagittis purus sit amet volutpat consequat mauris.
Ipsum nunc aliquet bibendum enim. Id neque aliquam vestibulum morbi.
Vitae purus faucibus ornare suspendisse sed nisi lacus sed.
Pulvinar neque laoreet suspendisse interdum consectetur libero id faucibus.
`
},
paris: {
name: "Paris",
color: "#73D8F4",
image: "paris.jpeg",
description: `
Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Quam pellentesque nec nam aliquam. Sagittis vitae et leo duis ut diam quam nulla.
Commodo elit at imperdiet dui accumsan sit.
Ac ut consequat semper viverra. At erat pellentesque adipiscing commodo elit at imperdiet dui.
Faucibus nisl tincidunt eget nullam non nisi est. Condimentum lacinia quis vel eros.
Nullam eget felis eget nunc. Dictum at tempor commodo ullamcorper a lacus vestibulum.
Ornare suspendisse sed nisi lacus. Eget est lorem ipsum dolor sit amet consectetur adipiscing elit.
Id diam vel quam elementum pulvinar etiam non quam. Sed libero enim sed faucibus turpis in eu.
Tempor commodo ullamcorper a lacus vestibulum sed arcu non.
`
},
rome: {
name: "Rome",
color: "#8E001C",
image: "rome.jpeg",
description: `
Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Orci porta non pulvinar neque laoreet suspendisse interdum consectetur.
Enim nec dui nunc mattis.
Dictumst quisque sagittis purus sit amet volutpat consequat.
Tortor vitae purus faucibus ornare suspendisse sed nisi lacus.
Turpis cursus in hac habitasse platea dictumst quisque sagittis.
Et ligula ullamcorper malesuada proin. Donec massa sapien faucibus et.
Sapien pellentesque habitant morbi tristique. A diam sollicitudin tempor id eu nisl.
Proin sagittis nisl rhoncus mattis rhoncus. Mauris a diam maecenas sed enim ut.
Sed elementum tempus egestas sed sed risus.
Auctor augue mauris augue neque gravida in fermentum et sollicitudin.
`
},
london: {
name: "London",
color: "#1F487E",
image: "london.jpeg",
description: `
Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Id porta nibh venenatis cras sed felis eget velit aliquet.
Aliquam ultrices sagittis orci a scelerisque purus.
Mauris pharetra et ultrices neque ornare aenean euismod elementum.
Commodo nulla facilisi nullam vehicula ipsum a arcu.
Volutpat ac tincidunt vitae semper quis lectus nulla. Purus in massa tempor nec feugiat.
Ac ut consequat semper viverra nam libero. At urna condimentum mattis pellentesque id nibh.
Maecenas volutpat blandit aliquam etiam erat velit scelerisque in dictum.
Lectus nulla at volutpat diam ut venenatis tellus in. Integer feugiat scelerisque varius morbi.
A lacus vestibulum sed arcu.
`
},
}
var header = document.querySelector("h1");
var main = document.querySelector(".main");
var img = document.querySelector("img");
var txt = document.querySelector("p");
header.textContent = cities.barcelona.name;
main.style.backgroundColor = cities.barcelona.color;
img.src = `img/${cities.barcelona.image}`;
txt.textContent = cities.barcelona.description;
如何使它在调用函数和传递参数时,程序以相同的方式工作?
function placeData( city ) {
header.textContent = toString(cities.city.name);
main.style.backgroundColor = cities.city.color;
img.src = `img/${cities.city.image}`;
txt.textContent = cities.city.description;
}
placeData("rome");
如果我正确理解了这个问题,您需要使用该字段而不是通过点,而是在方括号中,然后动态替换变量的值,而不是使用文字字符串:
您还可以通过缓存一个级别来节省一点速度: