2014-09-14 5 views
0

Когда я вставить этот код в свой файл, кажется, блокировать мой CSS от показа. Я сделал сценарий, чтобы попытаться распечатать текст после загрузки страницы, который затем я буду использовать позже, чтобы создать загруженную панель. Это мой код. Все, что происходит, я получаю текст «Тест», напечатанный на моей странице.JavaScript код блокировки CSS

<html> 
<head> 
    <link rel="stylesheet" type="text/css" href="custom.css"> 
    <script> 
    function myFunction() { 
    document.getElementById('index').innerHTML = "test"; 
    } 
    </script> 
</head> 

<!-- Page Body --> 
<body id="index" onload="myFunction()"> 
    <div class="header"> 
     <div id="headerbar"></div> 
     <ul id=""> 
    </div> 
</body> 
</html> 
+1

С 'innerHTML' вы удаляете все' 'div's внутри index'. – loveNoHate

+0

В настоящее время, я думаю, ваш код полностью заменяет содержимое тега body словом «test» (который удаляет заголовок). Я не знаю, как выглядит ваш CSS, но может быть, что вы просто удаляете все на странице, а не предотвращаете показ CSS. – Michael0x2a

+0

Да, вы были правы. – Andrew

ответ

0

Что именно ваш CSS должен стилизовать, когда вы устанавливаете innerHTML вашего элемента тела на «тест»? Выполняя это, вы удаляете все остальные элементы.

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

document.body.appendChild(document.createTextNode("test")); 
+0

Хорошо, что печатает текст, но моя цель - добавить код html. Когда страница загружается, я хочу, чтобы панель всплывала. Поэтому я сделал document.body.appendChild (document.createTextNode ("<ссылка rel = 'stylesheet' type = 'text/css' href = 'loaded.css'>")); И он просто печатает его на экране. – Andrew

+0

Да, это «TextNode», вы можете захотеть добавить какой-то другой элемент, используя 'var l = document.createElement (« link »); l.setAttribute ("отн", "таблица стилей"); ... '. Сделайте домашнее задание, используйте Google. –

4

Когда вы устанавливаете innerHTML из index элемента, он полностью заменяет все в организме. Таким образом, вы больше не имеете DIV с header классом, и вы больше не имеете DIV с headerbar ID. Для вашего CSS ничего не нужно. Это как если бы вы написали:

<body id="index">test</body> 
1

Ну для одного у нас нет никакого способа узнать, что делает ваш CSS, но проблема, которую я вижу в том, что, когда вы используете innerHTML перезаписывает существующий HTML. Как и во всем, внутри тега body перезаписывается только тестовый текст.

Оговорка: Моя презумпция является то, что у вас нет стиля на теле либо.

+0

Да, вы были правы. Есть ли способ просто написать html-код в документ? После загрузки doccument я хотел бы просто добавить еще одну css-документацию. – Andrew

+0

Для целей «теста» вы можете изменить свою внутреннюю ссылкуHTML на панель заголовка div. Также вы можете написать код HTML, где вы помещаете «тест» и т. Д. – lucusp

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