Предварительная загрузка изображений с помощью JavaScript в iOS

Question

Сценарий

Я использую два изображения, а именно 'car-light.png' и 'car-dark.png'.Когда пользователь касается изображения, которое было car-light.png, оно становится car-dark.png.

Вот код, который я использовал.написал этот код

$("#car").attr('src','url(car-dark.png)');

Вопрос

Есть ли способ ускорить это, предварительно загрузив изображение?Или я заключаю слишком крупную сделку с быстрой загрузкой?Если в этом случае необходима предварительная загрузка, правильный ли следующий код?

var img1 = new Image();
img1.src = "car-dark.png";

function changeCar(imgName) 
{
    document[imgName] = img1;
}

и в HTML

<img src="car-light.png" name="car" ontouchstart="changeCar('car')">

Answer 1

Помещение этого где-нибудь в ваш стартовый JS-код предварительно загрузит изображение:

var img1 = new Image();
img1.src = "car-dark.png";

Это приведет к тому, что изображение будет в кеше браузера, поэтому оно будет загружаться быстрее, если вы позже будете использовать его в действии страницы. Вы можете использовать объект img1 напрямую, но часто проще просто использовать URL-адрес и позволить браузеру извлекать изображение из его кеша памяти следующим образом:

<img src="car-light.png" id="car" ontouchstart="changeCar()">

function changeCar() {
    $("#car").attr('src','car-dark.png');
}