Uncaught ReferenceError: resource is not defined at HTMLAnchorElement.onclick (learn_demo01.html

今天写js代码时，出现一个问题：
**Uncaught ReferenceError: resource is not defined
at HTMLAnchorElement.onclick (learn_demo01.html:1)**

起因，我想给a标签添加一个点击事件，通过点击事件的函数修改页面的显示的图片(就是修改图片的路径)，但是给a标签添加上了onclick事件，但是点击事件的函数却一直没有触发。而且控制台一直出现上面的错误。
html

<h3>图片库</h3>    <ul class="img_link">        <li><a href="javascript:;" title="图片1">图片1</a></li>        <li><a href="javascript:;" title="图片2">图片2</a></li>        <li><a href="javascript:;" title="图片3">图片3</a></li>        <li><a href="javascript:;" title="图片4">图片4</a></li>        <li><a href="javascript:;" title="图片5">图片5</a></li>        <li><a href="javascript:;" title="图片6">图片6</a></li>        <li><a href="javascript:;" title="图片7">图片7</a></li>        <li><a href="javascript:;" title="图片8">图片8</a></li>    </ul>    <div class="show_img">        <img src="resource/images/run_img1.jpg" alt="图片1" />    </div>    <!--引入js文件-->    <script type="text/javascript" charset="UTF-8" src="js/demo01.js"></script>

js

//全局变量//获取图片所在的ul元素节点var ul_imgLink = document.getElementsByClassName("img_link")[0];//获取图片所在的所有li元素节点var li_imgLinks = ul_imgLink.getElementsByTagName("li");//获取显示图片的divvar div_img = document.getElementsByClassName("show_img")[0];//获取显示图片的div下的img元素节点var showImg = div_img.getElementsByTagName("img")[0];//定义一个图片的路径数组var img_urls = [    "resource/images/run_img1.jpg",    "resource/images/run_img2.jpg",    "resource/images/run_img3.jpg",    "resource/images/run_img4.jpg",    "resource/images/run_img5.jpg",    "resource/images/run_img6.jpg",    "resource/images/run_img7.jpg",    "resource/images/run_img8.jpg"];//onload事件window.onload=function(){    //调用下面函数    imgLinkClickEvent();}//给图片的超链接添加点击事件function imgLinkClickEvent(){    for(var i = 0; i < li_imgLinks.length; i++){        //获取图片所在的li元素节点下的a元素节点        var a_imgLinks = li_imgLinks[i].getElementsByTagName("a");        //获取图片所在的li元素节点下的a元素节点的title属性值        var a_title = a_imgLinks[0].getAttribute("title");        //获取图片所在的li元素节点下的a元素节点的href属性值        var a_url = img_urls[i];        //给图片的超链接添加点击事件        a_imgLinks[0].setAttribute("onclick","setImgAttribute("+a_url+","+a_title+")");    }}function setImgAttribute(url,title){    showImg.src = url;    showImg.alt = title;}

结果：我发现html中的页面a标签的onclick事件是这样的

onclick="setImgAttribute(resource/images/run_img4.jpg,图片4)"

大致一看，没错啊，参数正常，后来反复检查，就是没有给参数添加双引号，结果参数发生错误导致的。正确的写法应该是

//给图片的超链接添加点击事件 a_imgLinks[0].setAttribute("onclick","setImgAttribute(\""+a_url+"\",\""+a_title+"\")");

页面上应该显示的是这样的

onclick="setImgAttribute("resource/images/run_img4.jpg","图片4")"

错误一直显示没有发现resource就是因为参数不是String类型。
发此文章，与君共勉。