Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.12.2014, 01:45
Аспирант
Отправить личное сообщение для 2chan Посмотреть профиль Найти все сообщения от 2chan
 
Регистрация: 11.07.2014
Сообщений: 69

Управление псевдоклассами и псевдоэлементами
Есть ли возможность управлять псевдоэлементами и псевдоклассами через js, не добавляя/изменяя/удаляя style-теги? Именно управлять, ибо как получить их стили я и так знаю.
Сначала мне стало интересно, что будет если по mouseup-событию, т.е. когда после выделения юзер отпускает кнопку мыши, включать следующую функцию:
document.onmouseup = function() {
	var b = document.querySelector('::selection'); /* получаем выделенный фрагмент */ 
	/* 
	 * т.к. ::selection - псевдоЭЛЕМЕНТ , я подумал что в полученном объекте будет innerHTML или textContent
	*/
	b = b.innerHTML || b.textContent || b; /*но всё-таки есть это просто только выделенный текст - в конце будет b */
	alert(b); /* по задумке выведет выделенную часть */
};

, но document.querySelector вернул "SyntaxError: An invalid or illegal string was specified"

Что ещё запрещает querySelector? Я знаю что нельзя получить элементы с псевдоклассом :visited, может ещё что есть?
И как управлять псевдоэлементами ::before ::after. Запрос на получение элемента (ещё раз повторюсь, именно его самого, а не его стиля) '.class::before' как и '.class:before' - ничего не дал.
И, если есть способ, как изменить content этого самого :before или :after?

Да,
document.getElementById('class').querySelector(':first-letter');
- тоже возвращает null.

Последний раз редактировалось 2chan, 28.12.2014 в 01:52.
Ответить с цитированием
  #2 (permalink)  
Старый 28.12.2014, 13:50
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 3,018

2chan, так работать не будет.

window.getSelection() -> для получения выделенного текста

element.textContent.charAt(0) -> для получения первой буквы текста


Ну зачем изменять ::after/::before через JS? Просто меняешь класс и всё. Но если прям так надо, то:

var style = document.createElement('style');
style.type = 'text/css';
style.appendChild(document.createTextNode('\
    .myElem::before {\
        content: "123";\
    }\
    .myElem::after {\
        content: url("test.png");\
    }\
'));
document.head.appendChild(myElem);


Но лучше всё-таки использовать классы, ибо вариант с созданием style - говнокодинг.

Последний раз редактировалось ruslan_mart, 28.12.2014 в 13:56.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
web управление на основе javascript MaksLuk Элементы интерфейса 31 29.03.2015 21:27
Управление клавиатурой Officeoff.ru Элементы интерфейса 2 17.03.2014 14:33
Управление html кодом Иззет jQuery 7 06.02.2014 16:48
Управление звуком компьютера manafon Общие вопросы Javascript 6 29.07.2013 20:21
Управление скроллбарами Kepa Общие вопросы Javascript 5 21.12.2010 11:10