2013-05-05 2 views
0
<!DOCTYPE html> 
<html> 
<head> 
    <title>Anti Chess</title> 
</head> 
<body> 
    <h1 id="game_title">Anti Chess by theManikJindal</h1> 
    <br /> 
    <br /> 

    <table id="game"></table> 
    <script> 
     var white = 1; 
     var ta = document.getElementById("game"); 
     if(white == 1) 
     { 
      for(var i=0;i<8;i++) 
      { 
       var x = document.createElement('tr'); 
       ta.appendChild(x); 
       for(var j=0;j<8;j++) 
       { 
        var y = document.createElement('td'); 
        ta.childNodes[i].appendChild(y); 
        ta.childNodes[i].childNodes[j].setAttribute("id",String.fromCharCode(j+97)+(8-i).toString()); 
       } 

      } 

     } 
     else 
     { 
      for(var i=0;i<8;i++) 
      { 
       var x = document.createElement('tr'); 
       ta.appendChild(x); 
       for(var j=0;j<8;j++) 
       { 
        var y = document.createElement('td'); 
        ta.childNodes[i].appendChild(y); 
        ta.childNodes[i].childNodes[j].setAttribute("id",String.fromCharCode(104-j)+(i+1).toString()); 
       } 

      } 

     } 
    </script> 
</body> 
</html> 

Я не могу понять, почему этот скрипт не работает. Есть ли хорошие отладчики для Javascript, или нужно продолжать размахивать головой о стену, чтобы иметь смысл.Не могу понять, почему этот javascript не работает

Пожалуйста, помогите

Сценарий должен создать таблицу с 8x8 коробки и идентификатор атрибута должен быть установлен от «a8», «b8», «с8» ... «h8» в «a1» , "b1", "c1" ... "h1". для a, когда значение белого равно 1. И от «h», «g1», «f1» ... «a1» до «h8», «g8», ... «a8» для белого, не равного 1 белый = 1 по умолчанию.

+1

есть у проверил консоль ошибок –

+0

Да ничего там – tMJ

+2

Что конкретная проблема? Какие части работают правильно и какие части не работают должным образом? –

ответ

3

В таблицах всегда должен быть хотя бы один элемент <tbody>. Если этого не произойдет, браузер создаст его.

Это означает, что весь ваш childNodes доступ неправильный.

Я хотел бы предложить этот HTML:

<table><tbody id="game"></tbody></table> 

Это должно сделать ваш код работать, но вы можете упростить его дальше:

var white = 1, a = "a".charCodeAt(0), i, j, x, ta = document.getElementById("game"); 
for(i=0;i<8;i++) { 
    x = document.createElement('tr'); 
    for(j=0;j<8;j++) 
     x.appendChild(document.createElement('td')).id = 
       String.fromCharCode((white == 1 ? j : 8-j)+a)+(white == 1 ? 8-i : i+1); 
    ta.appendChild(x); 
} 

Как вы можете видеть, что я устранили необходимость для всего блок кода, который необходимо повторить, переместив отметку white == 1 в наиболее подходящее место. Я также больше использовал ссылку x, и я заменил «магические» значения тем, что будет легче понять, когда вы вернетесь к ней позже (переменная a).

Надеюсь, это поможет!

EDIT: Кроме того, я просто заметил, что в таблице нет контента - это то, что вы подразумеваете под этим, не появляется? Убедитесь, что у вас есть подходящий CSS, чтобы сделать ячейки таблицы видимыми.

+1

Его код, вероятно, работал все время, но это гораздо более чистое решение. – hank

+0

@hank Да, я просто замечаю, что, подумав об этом, еще немного XD –

+0

Да, это помогает. Благодарю. Пожалуйста, объясните этот тег . Впервые я когда-либо слышал об этом. – tMJ

1

Этот скрипт работает нормально. Я включил элемент в jsfiddle и обнаружил, что элементы созданы.

Я использовал некоторые CSS, чтобы показать, что коробки были созданы.

CSS

table{ 
border:1px solid black; 
} 
table tr, td{ 
border:1px solid black; 
} 

посмотреть здесь http://jsfiddle.net/9uHPx/

1

Java скрипт работает, но таблица не отображается.

Добавить границу = 1 в таблице

0

Сценарий работает нормально. Добавлена ​​пара петель, чтобы идентификатор печатался в теге td, чтобы вы могли видеть, что происходит. http://jsfiddle.net/5YRKx/

 var tableTemp = document.getElementById("game"); 

    for (var ii = 0, row; row = tableTemp.rows[ii]; ii++) { 
     //iterate through rows 
     //rows would be accessed using the "row" variable assigned in the for loop 
     for (var j = 0, col; col = row.cells[j]; j++) { 
     row.cells[j].innerHTML = row.cells[j].id; 
     } 
    }