Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.03.2011, 23:50
Человек
Отправить личное сообщение для 0931454574 Посмотреть профиль Найти все сообщения от 0931454574
 
Регистрация: 10.03.2011
Сообщений: 305

Создание элементов на странице.
Имеется следующий код HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Документ без названия</title>
<script src="createelement.js" type="text/javascript"></script>

<style type="text/css">
.declared{
color:#F00;
font-family:Arial, Helvetica, sans-serif;
font-weight:normal;
font-size:56px;}
.programmed{
color:#00F;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
font-size:10px;
}
</style>
</head>
<body>
<a href="" onclick=" hello()">Hello Denis </a>
<p id="hello">hello </p>

<div id="empty"></div>
</body>
</html>


Ниже привожу код файла javascript

// JavaScript Document
window.onload = function z (){
var hello=document.getElementById('hello'); // берем элемент с ай ди hello
hello.classname='declared'; // присваиваем стиль
var empty=document.getelementById('empty');
addNode(empty,"reader of"); //добавляем элемент с текстом
addNode(empty,"Ajax in Action!");
var children=empty.childNodes; // присваиваем переменно проходя по массиву потомком элемента
for(var i=o;i<children.lenght;i++){
children[i].className='programmed'; //присваиваем класс всем потомкам
}
// установка стиля
empty.style.border='solid green 2px' ;
empty.style.with="200px";}

function addNode(el,text){
//создание нового элемента
var childEl=document.createElement("div");
el.appendChild(childEl);
//формирование текста Добавляет нод в конце списка дочерных нодов элемента, а если добавляемый нод уже был в документе, то он перемещается
var txtNode=document.createTextNode(text);
childEl.appendChild(txtNode);
}
function hello()
{

alert("Mimino");
var hello=document.getElementById('hello'); // берем элемент с ай ди hello
hello.classname='declared';

}

И кого-то черта все дело не работает.То есть не создает нужные мне элементы. Спасибо за помощь!
Ответить с цитированием
  #2 (permalink)  
Старый 11.03.2011, 06:36
Аватар для Vulkan
Профессор
Отправить личное сообщение для Vulkan Посмотреть профиль Найти все сообщения от Vulkan
 
Регистрация: 25.05.2010
Сообщений: 511

Форматируйте код и выбирайте в следующий раз подходящий раздел для размещения темы.
Вот исправленный вариант вашего скрипта, ошибки были такие:
1. Вы давали название переменной hello, хотя одной из функций уже принадлежит такое название.
2. JS - то регистрозависимый язык, а поэтому вот так:
document.getelementbyid('test').classname - неправильно
document.getElementById('test').className - правильно
+ синтаксические:
не lenght а length
в цикле вы написали i=o (буква "о"), а нужно было i=0 (ноль).
Вроде это все ошибки.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Документ без названия</title>
<script type="text/javascript">
window.onload = function (){
    var h = document.getElementById('hello');
    h.className = 'declared';
    var empty = document.getElementById('empty');
    addNode(empty, "reader of");
    addNode(empty, "Ajax in Action!");
    var children = empty.childNodes;
    for (var i = 0; i < children.length; i++) {
        children[i].className = 'programmed';
    }
    empty.style.border = 'solid green 2px';
    empty.style.width = "200px";
}

function addNode(el, text) {
    var childEl = document.createElement("div");
    el.appendChild(childEl);
    var txtNode = document.createTextNode(text);
    childEl.appendChild(txtNode);
}

function hello() {
    alert("Mimino");
    var h = document.getElementById('hello');
    h.classname = 'declared';
}
</script>

<style type="text/css">
.declared{
color:#F00;
font-family:Arial, Helvetica, sans-serif;
font-weight:normal;
font-size:56px;}
.programmed{
color:#00F; 
font-family:Arial, Helvetica, sans-serif; 
font-weight:bold; 
font-size:10px;
}
</style>
</head>
<body>
<a href="" onclick=" hello()">Hello Denis </a>
<p id="hello">hello </p>

<div id="empty"></div>
</body>
</html>

Последний раз редактировалось Vulkan, 11.03.2011 в 06:40.
Ответить с цитированием
  #3 (permalink)  
Старый 14.03.2011, 20:55
Профессор
Отправить личное сообщение для розовый слоник Посмотреть профиль Найти все сообщения от розовый слоник
 
Регистрация: 17.10.2009
Сообщений: 258

Vulkan
возможно он просто скопировал кусок кода из книги "Ajax in Action!" я год назад читал эту книгу в просто ужасном переводе и с кучей ошибок. Так что ничего удивительного если это было просто не обдуманно скопировано с нее.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Динамическое создание элементов DOM Crudelis Общие вопросы Javascript 7 13.11.2010 02:28
динамическое создание элементов sg550 Events/DOM/Window 28 02.08.2010 19:34
Создание элементов Geddar jQuery 2 24.06.2009 19:29
IE: создание элементов. Jurasmi Events/DOM/Window 12 28.11.2008 02:10
Создание элементов createElement в IE. Phoenix Общие вопросы Javascript 6 26.09.2007 19:43