Ответы пользователя по тегу Angular
  • Изменения стиля слова при нажатии на него?

    Access_is_Denied
    @Access_is_Denied
    HTML
    <p style="font-size: 35px; font-weight: 600" onclick="lightSelection()">Изменения стиля слова при нажатии на него?</p>
    <p onclick="lightSelection()" style="font-size: 20px; font-weight: 400">
    Необходимо при клике на слово в тексте, оно выделялось рамкой. Не знаю как это сделать на Angular2. Может кто-то знает как это реализовать?
    </p>

    JavaScript
    function lightSelection() { // вызов функции при клике
    		var userSelection = window.getSelection(); // выделение
    			for(var i = 0; i < userSelection.rangeCount; i++) { // получаем местоположение выделеного текста
    				highlight(userSelection.getRangeAt(i)); // передаем дальше, в другую функцию
    			}
    		}
    			
    function highlight(range) {
    			var newNode = document.createElement("span"); // создаем span элемент
    			   newNode.setAttribute(
    			      "style",
    			      "background-color: yellow; display: inline;"
    			   ); // задаем стили для этого элемента
    range.surroundContents(newNode); // https://developer.mozilla.org/ru/docs/Web/API/Range/surroundContents
    			}

    Live DEMO
    выделение текста цветом: https://e-motiv.github.io/hilitor/example
    получить текст при клике: www.javascriptkit.com/javatutors/copytoclipboard.shtml

    Ps: Удачи вам!
    Ответ написан