Применить класс CSS к переменной JavaScript?

-4

Кто-нибудь знает, как я могу применить класс CSS к переменной JavaScript?Применить класс CSS к переменной JavaScript?

У меня есть две переменные:

var usr = 'You: ' + userinput; 
var rpl = 'Chatbot: ' + chatbot.transform(userinput);

ЕГР переменная для человеческого входа в систему, а переменная RPL запускает ответ из базы данных.

Мне нужна каждая переменная для применения к ней другого класса CSS.

Может ли кто-нибудь помочь?

источник

2013-04-18 Sarah Champion

Откуда вы отправляете свой чат? Это обычная HTML-страница, где вы можете использовать теги span в своих строк usr и rpl? Если да, просто добавьте там классы css. – ToBe

Что делается с этими переменными? Как они вводятся на странице? –

@SarahChampion Просто, чтобы сообщить вам, я продолжу свой ответ (с примерами к документам), чтобы (надеюсь) еще больше принести вам пользу. – VoidKing

Это зависит от того, как эти переменные вводятся на страницу, но вы можете обернуть их в тег span и увидеть, где вы закончите.

var usr = "<span class='user-input'>You: " + userinput + "</span>"; 
var rpl = "<span class='chatbot'>Chatbot: " + chatbot.transform(userinput) + "</span>";

use .user-input ans .chatbot в вашем CSS.

Еще одна вещь, которую вы можете сделать - это попытаться выследить тэг html, где ваши данные вводятся на странице через исходный код. В javascript (jquery) можно добавить класс к целевому тегу html.

источник

2013-04-18 14:23:31 Daniel

Вы не можете назначить класс CSS переменной javascript.

Если вы используете HTML, вы можете использовать javascript/jquery для вставки ваших значений в HTML-элементы, которые уже настроены как класс, или классы элементов могут быть изменены с помощью javascript/jquery.

Как было указано другими, нам нужно знать, куда вы указываете свои переменные. CSS-стили HTML-страниц (или других страниц, например XML), он не может стилизовать язык сценариев, что не имеет смысла, потому что javascript (или любой другой язык сценариев) не отображается.

Чтобы продлить мой ответ, считают, что у вас есть на следующей странице:

<html> 
    <body> 
     <p class="one"> 
      I am the first paragraph's text. 
     </p> 
     <p class="two"> 
      I am the second paragraph's text. 
     </p> 
    </body> 
</html>

Теперь у вас есть следующий CSS:

p.one 
{ 
    color: #f00; 
} 
p.two 
{ 
    color: #000; 
}

Как она стоит первый абзац будет иметь красный текст и второй будет иметь черный текст. Тем не менее, вы можете изменить это несколькими способами: , используя javascript/jquery. Одним из примеров ниже:.

document.getElementsByClassName("one").ClassName = "two"; 
document.getElementsByClassName("two").ClassName = "one";

С кодом выше, в настоящее время цвет этого пункта будет переключен (важно отметить, что вы не ограничены только оператор «=» Если вы используете «+ =» вы можете добавить, не удаляя, класс (т. е. элементу будет присвоен другой класс, не удалив старый класс). Чтобы удалить класс с javascript, просто используйте что-то вроде: document.getElementsByClassName("one").ClassName = "";

Наконец, другой подход может просто чтобы изменить стиль для самих элементов (например, вот ссылка, которую вы можете использовать: http://answers.oreilly.com/topic/1819-how-to-change-an-elements-css-properties-with-javascript/):

document.getElementsByClassName("one").style.color = "#000";

Какой путь я предпочитаю делать это, за исключением того, что я бы, вероятно, использовать JQuery подход, лично:

$(".one").css("color", "#000");

источник

2013-04-18 14:14:09 VoidKing

Вы также можете добавить новые классы в html элементов через javascript/jquery. – gaynorvader

@ gaynorvader Я думал, что так сказал? – VoidKing

@ gaynorvader О, никогда, я вижу, да, ты прав – VoidKing

CSS используется для элементов стайлинг разметки (HTML, и т.д.). Вы не можете применять CSS непосредственно к переменным Javascript.

Однако, когда вы переводите содержимое переменной в HTML, вы можете обернуть свои данные в теги HTML и применить к ним стили CSS.

источник

2013-04-18 14:14:43

Применить класс CSS к переменной JavaScript?

ответ

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