在Javascript中使用onclick方法

我是Javascript新手，正在做练习。我只是尝试使用onclick，当点击FIGHT按钮时，FIGHT函数就会运行。由于某些原因，fight函数没有运行，但我可以通过DOM获取按钮

HTML

目标4：任务-决斗III


点击开始战斗

Javascript

    /* 

    Name: Walker Kinne
    Date: 12/1/13
    Assignment: Goal1: Assignment: Duel1

    */

    (function(){


        console.log('program starts');

        var button = document.getElementsByTagName('a');

        console.log(button);

        button.onclick = function(e){


            fight();

            e.preventDefault();
            return false;
        };


    function fight(){
        console.log("in the fight function");

            var fighter1 = {name:'Spiderman', damage:20, health: 100};
            var fighter2 = {name:'Batman', damage:20, health: 100};


           var minDamage1 = fighter1.damage * .5;
           var minDamage2 = fighter2.damage * .5;

           var f1 = Math.floor(Math.random()*(fighter1.damage - minDamage1)+minDamage1);
           var f2 = Math.floor(Math.random()*(fighter2.damage - minDamage2)+minDamage2);

           console.log(fighter1.name);


          // console.log(f1);
           //console.log(f2);



           fighter1.health -=f2;
           fighter2.health -=f1;

           console.log("player1:" + fighter1.health);
           console.log("player2:" + fighter2.health);

            var a = fighter1.health;

    };
           //console.log(playerOneName+":"+playerOneHealth+playerTwoName+":"+playerTwoHealth);
            //var results = winnerCheck();

           //console.log(results);



           /*if(results === "no winner"){
               document.getElementById("kabal").
               //alert(fighter1[0]+":"+fighter1[2]+" ROUND"+round+" OVER"+fighter2[0]+":"+fighter2[2]);

            }else{
               alert(results);
               break;
           }

    */



        /* End of fight function */



    /*
    function winnerCheck(){
        console.log("winner check");
        var result = "no winner";

        if(fighter1[2]<1 && fighter2[2]<1){
            result = "You Both Die";
        }else if(fighter1[2]<1){
            result= fighter2[0] + " wins!!";
        }else if(fighter2[2]<1){
            result = fighter1[0] + " wins!!";
        };

        return result;
    };



    \/******** Program Starts ********/





    })();

/*
姓名：沃克·金恩
日期：2013年12月1日
任务：目标1：任务：决斗1
*/
（功能（）{
log（“程序启动”）；
var button=document.getElementsByTagName（'a'）；
控制台日志（按钮）；
button.onclick=函数（e）{
战斗（）；
e、 预防默认值（）；
返回false；
};
函数fight（）{
console.log（“在战斗功能中”）；
var fighter1={name:'Spiderman'，伤害：20，生命值：100}；
var fighter2={name:'Batman'，伤害：20，生命值：100}；
var minDamage1=fighter1.damage*.5；
var minDamage2=fighter2.damage*.5；
变量f1=Math.floor（Math.random（）*（fighter1.damage-minDamage1）+minDamage1）；
变量f2=数学地板（数学随机（）*（fighter2.damage-minDamage2）+minDamage2）；
console.log（fighter1.name）；
//控制台日志（f1）；
//控制台日志（f2）；
fighter1.health-=f2；
fighter2.health-=f1；
console.log（“player1:+fighter1.health”）；
console.log（“player2:+fighter2.health”）；
var a=战斗1.健康；
};
//log（playerName+“：”+playerHealth+playerWoName+“：”+playerWoHealth）；
//var results=winnerCheck（）；
//控制台日志（结果）；
/*如果（结果=“无赢家”）{
document.getElementById（“kabal”）。
//警报（fighter1[0]+“：”+fighter1[2]+“回合”+ROUND+“超过”+fighter2[0]+“：“+fighter2[2]）；
}否则{
警报（结果）；
打破
}
*/
/*战斗结束功能*/
/*
函数winnerCheck（）{
控制台日志（“赢家检查”）；
var result=“无赢家”；
如果（fighter1[2]
button=document.getElementsByTagName（'a'）；
返回一个元素数组。请注意，函数名为“按标记名获取元素”。要绑定事件，需要使用单个元素，而不是元素数组，即使该数组恰好只包含一个元素

而不是将属性添加到数组中

 button = document.getElementsByTagName('a');
 button.onclick = function(e){

您需要这样做，这会将
onclick
处理程序添加到第一个（也是唯一的）
a
：

 buttons = document.getElementsByTagName('a');
 buttons[0].onclick = function(e){

请注意，一旦添加第二个链接，就需要更具体的代码，然后<代码> GETelEngsByTyType < /代码>，因为您的<代码>按钮数组将包含多个元素。请考虑将唯一ID添加到要查找的按钮中，并使用<代码> GETelEnMyByID < /C> > .< /P> < P>我将向T添加唯一标识符。他的代码反对getElementsByTagName（a），因为它不是唯一的

//这段代码应该可以帮助你

            var button = document.getElementById('unique identifier');

    button.onclick = function(e){

               yourFN();
                //dont forget your e.prevent, false info here


            };

@哈迪：不，这完全是错误的。
fight
在它所在的位置就可以了。A）它被提升到作用域的顶部，B）在调用
onclick
处理程序之前，它不会被评估，在将来的某个时候。
            var button = document.getElementById('unique identifier');

    button.onclick = function(e){

               yourFN();
                //dont forget your e.prevent, false info here


            };