1

我对javascript有一个小问题，因为它不理解我，而且在某种程度上我不明白它对我的脚本做了什么。我正在尝试为自己编写一个国际象棋程序。首先，这是我的代码的一部分：

<html>

<head>

    <title>
        Klassix
    </title>    


    <!--    Scripts   -->
    <link   rel="stylesheet" 
            href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

    <script src="http://code.jquery.com/jquery-1.9.1.js">
    </script>

    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js">
    </script>

    <script>

        $(function() {
            $( ".draggable" ).draggable({ snap: true });
        });
    </script>



<style type="text/css">

    #board      {   position
                    height:840px;
                    width:840px;
                    border:20px solid #61380B;
                    border-collapse:collapse;   }

    .horizontal {   height:100px;
                    width:100px;
                    border:0px; }

    .vertical   {   height:100px;
                    width:100px;
                    border:0px; }   


    </style>

</head>


<body>

        <div id="game">
            <table id="board">
            </table>
        </div>


        <script type="text/javascript">     

        var board = document.getElementById('board')
        var color = 0; 

        for( var h = 1; h < 9; h++) {

            var newTr = document.createElement('tr');
            newTr.setAttribute('id', 'tr' + h)
            newTr.setAttribute('class', 'vertical')
            board.appendChild(newTr);

            for( var v = 1; v < 9 ; v++) {


                color = v % 2 ;

                var newTd = document.createElement('td');
                newTd.setAttribute('id', 'td' + v)
                newTd.setAttribute('class', 'horizontal')

                if(h === 1 || h === 3 || h === 5 || h === 7 && color === 0) {
                    newTd.style.backgroundColor = '#000000';
                } else if(h === 1 || h === 3 || h === 5 || h === 7 && color === 1) {
                    newTd.style.backgroundColor = '#ffffff';        
                } else if( h === 2 || h === 4 || h === 6 || h === 8 && color === 1) {
                    newTd.style.backgroundColor = '#000000';
                } else if(h === 2 || h === 4 || h === 6 || h === 8  && color === 0) {
                    newTd.style.backgroundColor = '#ffffff';        
                }

                document.getElementById('tr' + h).appendChild(newTd);   
                console.log(h + '|' + v + '|' + color)                  
            }
        }
    </script>

</body>

因此，如您所见，我尝试使用 javascript 生成棋盘以避免编写大量文本。板子应该是黑白交替的。我在最后一个脚本部分中所做的 if 条件应该清楚这一点。但是我的浏览器显示前 6 行是黑色的，最后 2 行是白色和黑色的，应该是这样。Soooo，最后我的问题是如何正确地做，或者我应该采取完全不同的方法。我希望有一个人可以帮助我。（我不是英语母语人士。也许你可以原谅某些错误。）

4

1 回答 1

2

根据此页面，&&之前已评估，||因此，以下条件

if(h === 1 || h === 3 || h === 5 || h === 7 && color === 0)

相当于

if(h === 1 || h === 3 || h === 5 || (h === 7 && color === 0))

.

但我认为您希望您的条件看起来更像以下

if((h === 1 || h === 3 || h === 5 || h === 7) && color === 0)

只需添加 perens

于 2013-07-16T15:06:14.170 回答