简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - removeChild（）出现语法错误
天蓬老师
天蓬老师 2017-04-11 10:36:51
0
2
737

请看第33行，给新添加的li元素绑定删除事件，提示语法错误，为什么呢？谢谢
cn("deletes")[0].addEventListener("click",function(){$("outer_wrap").removeChild(this.parentNode)});

<body> 
<button id="adds">添加</button>
<button id="delete">删除</button>
<ul id="outer_wrap"> 
<li>
<input type="text" value="标题1"><input type="text" value="链接">
<button>submit</button>
<button class="deletes">delete</button>
</li> 
<li>
<input type="text" value="标题2"><input type="text" value="链接">
<button>submit</button>
<button class="deletes">delete</button>
</li> 
</ul> 
<script>
/*dom操作方法*/
function $(id){ 
return document.getElementById(id); 
} 
function cls(element){ 
return document.getElementsByTagName(element); 
}
function cn(element){ 
return document.getElementsByClassName(element); 
}
/*添加li元素*/
function add_li(){
    var newli = document.createElement("li");
    $("outer_wrap").insertBefore(newli,cls("li")[0]);
    cls("li")[0].innerHTML="<li><input type='text' value='标题2'><input type='text' value='链接'><button>submit</button><button class='deletes'>delete</button></li> ";
/***这里********/
/***这里********/
    /*给新添加的li元素绑定删除事件*/
    cn("deletes")[0].addEventListener("click",function(){$("outer_wrap").removeChild(this.parentNode)});
 /***这里********/
 /***这里********/
}
/*移除li*/
function remove_li(){
    $("outer_wrap").removeChild(this.parentNode)
}
/*给删除按钮绑定移除事件*/
function bind_del(){
    for(i=0;i<2;i++)
    {
        cn("deletes")[i].addEventListener("click",remove_li);
    }
}
bind_del();
/*绑定添加li事件*/
$("adds").addEventListener("click",add_li);

</script>
天蓬老师
天蓬老师

欢迎选择我的课程，让我们一起见证您的进步~~

모든 응답(2)
迷茫
迷茫2017-04-11 10:38:51 2층 
 cls("li")[0].innerHTML="<li><input type='text' value='标题2'><input type='text'          value='链接'><button>submit</button><button class='deletes'>delete</button></li> ";
 这句有问题,你创建了一个li元素还往里面写多了一个li..
  cls("li")[0].innerHTML="<input type='text' value='标题2'><input type='text'          value='链接'><button>submit</button><button class='deletes'>delete</button> ";
  去掉就行了
좋다 +0
답글 추가
小葫芦
小葫芦2017-04-11 10:38:51 1층


你这写的不对，ul里套了两层li,this.prarentNode是li 里的li,所以不对，把cls("li")[0].innerHTML="<input type='text' value='标题2'><input type='text' value='链接'><button>submit</button><button class='deletes'>delete</button> ";去掉，另外cn("deletes")[0].addEventListener()改为newli.addEventListener()。获取class是动态的

좋다 +0
답글 추가
인기 주제
더>
인기 기사
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！