Как применить стиль к методу alert и document.write?

@adlansuliman · Регистрация: 05.05.2013

Студворк — интернет-сервис помощи студентам

Подскажите как применить стиль (можно и css) к методу alert и document.write. Я знаю что можно и без функции и без js все сделать. Но мне интересно как применить стиль в этом случае.
Вот код с методов alert

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<html>
    <head>
    <meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
    </head>
    <body>
        <script>
        function vi()
            {
                alert("Привет мир!");
            }
        </script>
        <input type=button onClick="vi()" value="Нажми">
    </body>
</html>

Вот код с document.write

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<html>
    <head>
    <meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
    </head>
    <body>
        <script>
        function vi()
            {
                document.write("Привет мир!");
            }
        </script>
        <input type=button onClick="vi()" value="Нажми">
    </body>
</html>

Если необходимо, вот простой css

CSS
1
2
3
4
sss {
    color: red;
    font-size: 25
};

@kalabuni · 12.12.2015, 04:57

1) к методу alert () никакие стили неприменимы -- его вид определяется даже не только настройками браузера, но и настройками операционной системы

2) никто не мешает вам добавить к выводимому методом write () тексту любой тег, которому можно указать любые нужные вам правила стилей
например, вместо банального document.write (text);
пропишите document.write ('<span style="color: red; font-size: 25px">' + text + '</span>');

ещё отмечу, что приведённый вами "простой css" -- он неграмотный (и будет работать только в старых версиях MSIE): ныне для всех линейных размеров необходимо указывать размерность (единицу измерения), т.е. ваш код надо переписать так:
font-size: 25px

@adlansuliman · 12.12.2015, 11:06 **[ТС]**

Про css взял на заметку, спасибо за замечание.
Про alert тоже не знал..
А вот с document.write как правильно будет написать с использованием css?

@alexsamos33 · 12.12.2015, 12:48

Сообщение от adlansuliman

Про css взял на заметку, спасибо за замечание.
Про alert тоже не знал..
А вот с document.write как правильно будет написать с использованием css?

Задать элементу класс, а потом, уже отдельно от javascript в css написать определение стилей для этого класса.

HTML5
1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript">
document.write('<span class="txtwrite">Это наш текст</span>');
</script>
 
<style type="text/css">
.txtwrite {
    color: red;
    font: 20pt Arial;
    text-align: center;
}
</style>

@adlansuliman · 12.12.2015, 13:43 **[ТС]**

Надеюсь я верно вас понял. Вот что написал, где я ошибся -_-

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<html>
    <head>
    <meta charset="UTF-8">
<link rel="stylesheet" href="style.css" type="text/css">
    </head>
    <body>
        <script type="text/javascript">
        function vi()
            {
                document.write('<span class="primer">'+"текст"+'</span>');
            }
        </script>
        <input type=button onClick="vi()" value="Нажми">
    </body>
</html>

CSS
1
2
3
.primer {color: red;
font: 14pt; 
}

@alexsamos33 · 12.12.2015, 14:07

Сообщение от adlansuliman

Надеюсь я верно вас понял. Вот что написал, где я ошибся -_-

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<html>
    <head>
    <meta charset="UTF-8">
<link rel="stylesheet" href="style.css" type="text/css">
    </head>
    <body>
        <script type="text/javascript">
        function vi()
            {
                document.write('<span class="primer">'+"текст"+'</span>');
            }
        </script>
        <input type=button onClick="vi()" value="Нажми">
    </body>
</html>

CSS
1
2
3
.primer {color: red;
font: 14pt; 
}

Да нельзя write использовать после загрузки страницы!
Почитайте Метод document.write.
Используйте innerHTML, например так:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<html>
    <head>
    <meta charset="UTF-8">
<link rel="stylesheet" href="style.css" type="text/css">
    </head>
    <body>
    <div id="elem1"></div>
        <script type="text/javascript">
        function vi()
            {
                document.getElementById('elem1').innerHTML = '<span class="primer">'+"текст"+'</span>';
            }
        </script>
        <input type=button onClick="vi()" value="Нажми">
    </body>
</html>

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .	SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .

Как применить стиль к методу alert и document.write?

Решение

Решение

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	12.12.2015, 04:57
	Сообщение было отмечено adlansuliman как решение Решение 1) к методу alert () никакие стили неприменимы -- его вид определяется даже не только настройками браузера, но и настройками операционной системы 2) никто не мешает вам добавить к выводимому методом write () тексту любой тег, которому можно указать любые нужные вам правила стилей например, вместо банального document.write (text); пропишите document.write ('<span style="color: red; font-size: 25px">' + text + '</span>'); ещё отмечу, что приведённый вами "простой css" -- он неграмотный (и будет работать только в старых версиях MSIE): ныне для всех линейных размеров необходимо указывать размерность (единицу измерения), т.е. ваш код надо переписать так: font-size: 25px 1

@adlansuliman 0 / 0 / 0 Регистрация: 05.05.2013 Сообщений: 189
	12.12.2015, 11:06 [ТС]
	Про css взял на заметку, спасибо за замечание. Про alert тоже не знал.. А вот с document.write как правильно будет написать с использованием css? 0

Опции темы