2012-07-16 5 views
1

Попытки заменить conents из целой страницы (работы) + также заменить ссылку на файл style.css в game.css с запросомjQuery: замените ссылку на style.css на game.css?

$.get('/games/14', function(data){ var $page = $(data); 
    $('head').append('<link rel="stylesheet" href="style2.css" type="text/css" />'); 
    //$('#layout').empty().append($page); 
    $('body').empty().append($page); 
}) 

Я, кажется, не в состоянии изменить «style.css "to" game.css "независимо от того, что я пытаюсь, с помощью которого Jquery Guru знает, как это сделать? спасибо !

UPDATE: попробовал предложения ниже еще есть проблемы, это то, что я не буду использовать сейчас (не замена файла .css)

$.get('/games/14', function(data){ 
$("link[href='style.css']").attr({href: 'game.css'}); 
var $page = $(data); 
$('body').empty().append($page); 
}) 

ответ

2

Здесь вы идете, просто проверили это, и это сработало.

<!DOCTYPE HTML> 
<html> 
<head> 
    <script src="jquery-1.7.2.min.js"></script> 
    <link href="/assets/frontend.css" media="screen" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
    <script> 
     $("link[href='/assets/frontend.css']").attr('href', '/assets/game.css'); 
    </script> 
</body> 
</html> 

Чтобы Anwer свой комментарий ниже, я проверил его с помощью Firebug. Используя вкладку «Консоль», я вижу, что она сначала попыталась загрузить активы/frontend.css, запустила JS, затем попыталась загрузить assets/game.css.

loading

Затем я проверил DOM на вкладке HTML в поджигатель, и увидел, что ссылка элементы HREF атрибут был обновлен.

enter image description here

+0

также не работает для меня, как вы его протестировали? Я сохранил это как .html, он по-прежнему показывает frontend.css при попытке загрузить страницу, просмотреть источник. – Rubytastic

+2

Нажав 'view source' в браузере, вы не укажете * текущее состояние DOM страницы. Он покажет вам документ, который сначала вытащил с сервера. I.e., * original * file, без каких-либо изменений, выполненных с использованием JavaScript. Я предлагаю использовать что-то вроде Chrome/Safari Web Inspector или Firebug для Firefox. –

+0

Эдд Морган прав. Просто просмотр источника не покажет вам ничего, что было обновлено с момента начальной загрузки DOM. Я обновил ответ с объяснением того, как я его тестировал. –

1

Целевая ссылка элемент с HREF атрибута «style.css 'и заменить HREF атрибут этого элемента с „game.css“:

$("link[href='style.css']").attr({href: 'game.css'}); 
+0

Ok Я пытался это сам без толку, я пытаюсь заменить это <ссылка HREF = «/ активы/frontend.css» СМИ = «экрана» отн = "stylesheet" type = "text/css" /> с "/assets/game.css" любая идея? – Rubytastic

1

Вы можете использовать attr() функцию JQuery, чтобы изменить HREF.

$("link[href=style.css]").attr('href', 'game.css'); 

Возможно, вам понадобится более мощный селектор, но вы сделаете это.

+0

кажется неправильным синтаксисом с выше работает тот же вопрос, хотя. – Rubytastic

+0

Правильный синтаксис. Убедитесь, что «style.css» в селекторе jQuery * соответствует * href 'link', который вы пытаетесь заменить, и что« game.css »в вызове' attr() 'соответствует адресу таблицу стилей, к которой вы пытаетесь ее изменить. Кроме того, убедитесь, что исходный элемент 'link' фактически существует. В вопросе редактирования, кажется, вы удалили вызов, который вы использовали для вставки элемента 'link', в первую очередь. –

1

href атрибут подстановка, как предложено в других ответах непоследовательно обрабатываются различными браузерами (т.е. не может вызвать повторную подачу/повторную визуализацию). Вместо этого исходный элемент стиля должен быть удален, а новый элемент с нужным href должен быть вставлен на его место. Интуитивный способ сделать это с JQuery:

$('link[href$="style.css"]').replaceWith('<link href="game.css" ... ></link>'); 
+0

Какие браузеры это непоследовательно обрабатывается? Я просто тестировал его в IE7, IE8, IE9, FF, Safari и Chrome. Он работал, как ожидалось, во всех из них. –

+0

@CodyBonney: слухи, но я всегда работал в предположении, что IE7 & 8 испортит это; как описано здесь: http://stackoverflow.com/q/3007669/1081234 –

Смежные вопросы