Укажите стиль в строке запроса URL

Question

Предположим, у меня есть веб-страница.

http://foo.com/bar.html

Можно ли как-нибудь предоставить ссылку на эту страницу, которая, например, делает все <b> разделы красными?

Я предполагаю, что мне нужен какой-нибудь скрипт в bar.html и URL-адрес вроде

http://foo.com/bar.html?style="b{color:red;}"

Возможно ли это, и если да, то есть ли стандарт?способ сделать это?

Answer 1

Я бы сказал, что самым простым и абстрактным способом было бы просто добавить стиль к голове.Опять же, как уже говорилось, вы можете проанализировать его и проверить его правильный формат и избежать атак.Вы дадите каждому веб-пользователю прямой доступ к вашей таблице стилей в своей голове.

window.onload = function() {
  if(document.location.search.indexOf('style=')>-1) {
    var style = decodeURI(document.location.search.substring(document.location.search.indexOf('style=') + 6));
    if(style.indexOf(',')>-1) { style = style.substring(0,style.indexOf(',')); }
    var elem = document.createElement('style');
    elem.type='text/css';
    elem.innerHTML = style;
    document.head.appendChild(elem);
  }
};

Тогда вы сможете добавить любые и все модификации стиля в ваш URI, например, ?style=body{background-color:blue;}%20b{color:red;}

Answer 2

почему бы вам не попробовать это с CSS?

inside example.css file:
br 
{
color:red;
}

Answer 3

Вы можете прочитать строку запроса с помощью location.search и затем применить любую логику, какую хотите, к возвращаемой строке.

Будьте осторожны, чтобы не открыть себя для атаки XSS.

Answer 4

Вы можете добавить обработчик к элементу ссылки.

Вы можете сделать это так:

document.getElementById('clickme').onclick = function(){

    var bolds = document.body.getElementsByTagName("b");
    for(var i = 0; i < bolds.length; i++){
         bolds[i].style.backgroundColor = 'red';
    }

}

Демо: http://jsfiddle.net/maniator/HH2Cv/

Answer 5

Вы можете настроить javascript, чтобы делать все, что вы хотите.Не существует ранее существующего универсального способа сделать это.

Вы можете выбрать document.location.hash, чтобы извлечь значение и добавить новый стиль для элементов b.Синтаксический анализ строки запроса немного сложнее, поскольку по умолчанию он не встроен в JS.