设为首页收藏本站
切换到窄版

鱼C论坛

 找回密码
 立即注册
鱼C论坛»论坛 › 编程语言专区 › Web开发 › 为何报错？
返回列表 发新帖
查看: 3145|回复: 7

[已解决]为何报错？

[复制链接]
小黄练编程
发表于 2022-3-31 18:30:18 | 显示全部楼层 |阅读模式

马上注册，结交更多好友，享用更多功能^_^

您需要 登录 才可以下载或查看，没有账号？立即注册

x
本帖最后由 小黄练编程 于 2022-3-31 19:57 编辑
  1. <!DOCTYPE html>
  2. <html>
  3.         <head>
  4.                 <meta charset="utf-8">
  5.                 <title></title>
  6.                 <style>
  7.         ul li{
  8.                 position:relative;
  9.                 background-color:red;
  10.                 height:40px;
  11.         }
  12.         button{
  13.                 position:absolute;
  14.                 top:0;
  15.                 right:0;
  16.                 display:inline-block;
  17.                 /* width:100px; */
  18.                
  19.         }
  20.         </style>
  21.         </head>
  22.         <body>
  23.                 <textarea id='text'>请在此留言</textarea>
  24.                 <input id='ipt' type='button'  value='发布留言'>
  25.                 <ul>
  26.                         <li>你好！<button>删除</button></li>
  27.                         <li>你好！<button>删除</button></li>
  28.                         <li>美好的一天<button>删除</button></li>
  29.                 </ul>
  30.                 <script>
  31.                 var text=document.querySelector('#text');
  32.                 var ipt=document.querySelector('#ipt');
  33.         var ul=document.querySelector('ul');
  34.                
  35.                 text.onfocus=function(){
  36.                         if(this.value=='请在此留言'){
  37.                                 this.value='';
  38.                         }
  39.                 }
  40.                 text.onblur=function(){
  41.                         if(this.value==''){
  42.                                 this.value='请在此留言';
  43.                         }
  44.                 }
  45.                 ipt.onclick=function(){
  46.                         //创建好一个新节点
  47.                         var lili=document.createElement('li');
  48.                         if(text.value!==''){
  49.                         lili.innerHTML=text.value;
  50.                        
  51.                         //将创建好的新节点添加到ul的第一个子元素前面。
  52.                         ul.insertBefore(lili, ul.children[0]);
  53.                        
  54.                         //执行完前面的操作后将textarea的value值改为'';
  55.                         text.value='';
  56.                         }
  57.                 }
  58.                 //给li里的按钮绑定删除事件
  59.                 var  lis=ul.children;
  60.                 var  deleat=lis[0].children[0];//这里不可以写成lis，因为lis代表一个数组。
  61.                 var deleat=[];
  62.                 for(var i=0;i<lis.length;i++){
  63.                         deleat[i]=lis[i].children[0];
  64.                                 lis[i].setAttribute('index',i);
  65.                             deleat[i].onclick=function(){
  66.                                
  67. //那个按钮点击，删除相应的li,即ul里的第几个元素。
  68.                                 ul.removeChild(ul,children[lis[i].index]);
  69.                         }
  70.                 }
  71.                
  72.                
  73.                 </script>
  74.         </body>
  75. </html>
复制代码
最佳答案
月排行榜 / 总排行榜
ba21
2022-3-31 20:23:08
小黄练编程 发表于 2022-3-31 19:49
整好了

不知道你要实现什么，前面回复你了闭包中无法直接传i进去，你偏偏还是要这么传个i进去。
用的的代码修改处，自已参考。
  1.                 //给li里的按钮绑定删除事件
  2.                 var  lis=ul.children;
  3.                 for(var i=0;i<lis.length;i++){
  4.                         var deleat=lis[i].children[0];
  5.                         lis[i].setAttribute('index',i); // 给li添加属性index                              
  6.                         deleat.onclick=function(){
  7.                             j = this.parentNode.getAttribute('index'); // 获取li属性index的值
  8.                             lis[j].removeChild(lis[j].children[0]);
  9.                         }
  10.                 }
复制代码
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

ba21
发表于 2022-3-31 18:33:28 | 显示全部楼层
代码上全，方便人家调试。
你太看得起大家了，反正我是光看看不出问题来。
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

小黄练编程
 楼主| 发表于 2022-3-31 19:49:26 | 显示全部楼层
ba21 发表于 2022-3-31 18:33
代码上全，方便人家调试。
你太看得起大家了，反正我是光看看不出问题来。

整好了
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

小黄练编程
 楼主| 发表于 2022-3-31 19:57:43 | 显示全部楼层
ba21 发表于 2022-3-31 18:33
代码上全，方便人家调试。
你太看得起大家了，反正我是光看看不出问题来。

刚改了
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

ba21
发表于 2022-3-31 20:23:08 | 显示全部楼层    本楼为最佳答案   
小黄练编程 发表于 2022-3-31 19:49
整好了

不知道你要实现什么，前面回复你了闭包中无法直接传i进去，你偏偏还是要这么传个i进去。
用的的代码修改处，自已参考。
  1.                 //给li里的按钮绑定删除事件
  2.                 var  lis=ul.children;
  3.                 for(var i=0;i<lis.length;i++){
  4.                         var deleat=lis[i].children[0];
  5.                         lis[i].setAttribute('index',i); // 给li添加属性index                              
  6.                         deleat.onclick=function(){
  7.                             j = this.parentNode.getAttribute('index'); // 获取li属性index的值
  8.                             lis[j].removeChild(lis[j].children[0]);
  9.                         }
  10.                 }
复制代码
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

小黄练编程
 楼主| 发表于 2022-3-31 23:02:13 | 显示全部楼层
ba21 发表于 2022-3-31 20:23
不知道你要实现什么，前面回复你了闭包中无法直接传i进去，你偏偏还是要这么传个i进去。
用的的代码修改 ...

大哥，咋才能学好前端啊，需要注意些什么，以后几年那些技术会过时，例如，两三年后可以放心用新特性吗，不用考虑兼容性的问题。
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

ba21
发表于 2022-3-31 23:30:31 | 显示全部楼层
小黄练编程 发表于 2022-3-31 23:02
大哥，咋才能学好前端啊，需要注意些什么，以后几年那些技术会过时，例如，两三年后可以放心用新特性吗， ...

慢慢学
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

小黄练编程
 楼主| 发表于 2022-3-31 23:44:55 | 显示全部楼层
ba21 发表于 2022-3-31 23:30
慢慢学

小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2025-5-5 02:31

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表