Не получается добавить элемент на страницу
Пожалуйста помогите найти ошибку. Не получается добавить элемент на станицу.
var square = document.createElement('div');
var container = document.getElementById('container');
container.appendChild(square);
element.classList.add('square');
|
Alexander__,
Что такое element и где сама функция, которая должна выполнить описанные действия? |
Ой, там должно быть имя элемента), но даже при исправлении этой ошибки ничего не работает(
|
Alexander__,
Вы описываете, что должно быть сделано. Должна быть и функция, которая запускает выполнение перечисленного. Где она? |
А нельзя ли добавлять элементы без функции?
|
|
Так тоже ничего не происходит
var button = document.getElemetById('but');
function draw() {
var square = document.createElement('div');
var container = document.getElementById('container');
container.appendChild(square);
square.classList.add('square');
}
button.addEventListener("click", draw);
|
Alexander__,
целиком код нужен , попробуйте поставить скрипт вниз страницы когда уже есть элементы с которыми скрипт работает |
Вот код целиком
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="container"></div>
<button id="but"></button>
<script>
var button = document.getElemetById('but');
function draw() {
var square = document.createElement('div');
var container = document.getElementById('container');
container.appendChild(square);
square.classList.add('square');
}
button.addEventListener("click", draw);
</script>
</body>
</html>
|
|
Alexander__,
строка 10!!! |
Спасибо большое за помощь, но кажется я понял что у меня не работает вот эта строчка
square.classList.add('square');
Можете подсказать как исправить? Да, 10 строку я уже исправил, спасибо. |
Alexander__,
Что именно не работает? В этом примере alert выводит присвоенное элементу square свойство classList |
Так у меня же должен добавиться класс.
|
Alexander__,
С Chrome Dev Tools знакомы? Проинспектируйте код в том же примере выше. У созданного элемента присутствует class = "square" |
Alexander__,
<html>
<head>
<meta charset="utf-8">
<link rel="stysheet" href="style.css">
</head>
<body> <style type="text/css">
.square{
border: 1px dashed Gray; padding: 5px; height: 100px; width: 100px;
background-image: -webkit-gradient(linear, left, right, color-stop(0, #FF1493), color-stop(1, #0060BF));
background-image: -o-linear-gradient(left, #FF1493, #0060BF);
background-image: -moz-linear-gradient(left, #FF1493, #0060BF);
background-image: -webkit-linear-gradient(left, #FF1493, #0060BF);
background-image: linear-gradient(to right, #FF1493, #0060BF);
float: left;
}
</style>
<div id="container"></div>
<button id="but">ок</button>
<script>
var button = document.getElementById('but');
function draw() {
var square = document.createElement('div');
var container = document.getElementById('container');
container.appendChild(square);
square.classList.add('square');
}
button.addEventListener("click", draw);
</script>
</body>
</html>
|
Я перенес class square из отдельного файла в файл с HTML и у меня все заработало. В общем спасибо за помощь и хотелось бы узнать почему так получилось.
|
Alexander__,
потому что пути к css файлу или в самом файле видимо неправильные |
Да, точно, я нашел ошибку
|
| Часовой пояс GMT +3, время: 03:26. |