Присвоение класса элементу с заранее неизвестным ID
Здравствуйте.
Мне нужен совет, быть может некоторая помощь кодом, очень надеюсь ее получить здесь. Итак, дано: я имею список на сайте неизвестной длины следующего вида: <ul id="list"> <li id="somename"><a href ="/somename/">somename</a><li> <li id="somename_1"><a href ="/somename_1/">somename_1</a><li> <li id="somename_2"><a href ="/somename_2/">somename_2</a><li> <li id="somename_3"><a href ="/somename_3/">somename_3</a><li> <li id="somename_4"><a href ="/somename_4/">somename_4</a><li> ...... <li id="somename_n"><a href ="/somename_n/">somename_n</a><li> </ul> Замечу, что ID элемента списка, href и текст ссылки генерируются на серверной стороне и совпадают друг с другом, но тройки значений могут быть любыми (<li id="korova"><a href="/korova/">korova</a><li>) etc. Задача: написать js, который в зависимости от текущего URL добавляет класс "someclass" соответствующему элементу списка. Пример: если document.URI==http://www.site.com/somename_3/ то элемент с id="somename_3" получает класс "someclass". Обращу внимание, что с помощью GetElementByID и функцией classname я не могу уверенно оперировать, так как неизвестен ID последнего элемента. Усложняет ситуацию то, что к серверной части я не имею доступа и могу только лишь отдать js-файл, чтобы его прикрутили к сайту. Заранее спасибо |
Извлекайте из строки window.location.href нужный идентификатор и добавляйте CSS-класс соответствующему элементу:
document.getElementById("id").className += " someclass";
|
var id = (/\/(somename_\d)(\/|$)/).exec(window.location.href);
if (id && id[1]) {
var element = document.getElementById(id[1]);
if (element) {
element.className += " someclass";
}
}
|
Замечу, что проблему я все же решил, пусть и не столь изящным способом:
function menu_active() {
var str=window.location.pathname //window.location.pathname проще парсить, на мой взгляд, чем window.location.href
var reg=/\//g //так как переменная принимает значение в виде /something/, то достаточно просто убрать слэши такой корявой регуляркой
var idl=str.replace(reg, "")
if(idl.length > 0) // если мы не на главной странице, то приписываем элементу списка активный класс .active
{
document.getElementById(idl).className += " active";
}
else { //на главной странице window.location.pathname с отрезанными слэшами возвращает null, поэтому делаем активным первый элемент списка с известным заранее id
document.getElementById("first").className += " active";
};
};
Вдруг, кому-то пригодится?:) |
| Часовой пояс GMT +3, время: 13:50. |