批改状态:合格
老师批语:
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><style type="text/css">body{background-color: skyblue;}.comment{min-width:80%;min-height: 80%;border:1px solid #ccc;}textarea{margin: 0 auto;}lable{text-align: center;}</style></head><body><form action="" name="write" id="write" class="comment"><lable for="content">请留言</lable><textarea name="content" id="content" cols="30" rows="5" placeholder="请不要超过100字,谢谢"></textarea><button class="submit" name="submit">提交</button></form><ul class="list" placeholder="fdsjf"></ul><script type="text/javascript">//获取formconst form=document.querySelector(".comment");//textareaconst textarea=document.querySelector("textarea");//btnconst submitBtn=document.querySelector(".submit");//ulconst commentList=document.querySelector(".list");//提交按钮点击事件submitBtn.onclick=function(ev){//trim()省去字符串两边的空格// console.log(textarea.value.trim());ev.preventDefault();let value=textarea.value.trim();//剩余字符let remainder=100-value.length;if(value.length>0&&value.length<=100){// 将留言插入列表//最新的留言总是第一条alert("你还可以输入"+remainder+"个字符");const newContent=document.createElement("li");newContent.textContent=value;//为新留言添加样式newContent.style.color="white";newContent.style.border="1px solid #ccc";newContent.style.listStyle="none";//创建一个删除按钮const delBtn=document.createElement("button");delBtn.textContent="删除"delBtn.style.backgroundColor="white";delBtn.style.float="right";delBtn.style.border="none";delBtn.style.marginTop="3px"// 将删除按钮添加到新留言的后面newContent.append(delBtn);//将新留言添加到ul里面commentList.prepend(newContent);//让按钮自定义取消或者是确认confirm()delBtn.onclick=function(){if(confirm("是否删除")){this.parentNode.remove();alert("删除成功");}}//通知用户留言成功alert("留言成功");textarea.value=null;return false;}else{alert("没有内容或者超过100字");textarea.focus();return false;}}</script></body></html>
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title></head><body><script type="text/javascript">//concat()连结两个字符串相当于"+"let str="html".concat("js, css, btr");console(str);//html js css btrconsole.log(['hello'],.concat(['p']));//[hellop]//slice(start,end),当中只有一个参数时取参数后面的全部字符串,接受负值let str="hello php.cn";let res=str.slice(0,5)//hellolet res2=str.slice(0)//hello php.cnlet res3=str.slice(-6)//php.cnlet res4=str.slice(-2)//cn//substr(start,size)let str="hello php.cn";let sub=substr(0,5)//hellolet sum2=substr(-6,3)php////trim()不计算字符串之间的空格//split将字符串变为数组,传入的参数在新生成的数组中取出。let sp=str.split("");console.log(sp);//[h e l l o,p h p c n]//运用let email="admin@php.cn";res=email.split('@');console.log(res)//[admin][php.cn]console.log(res[0])//adminconsole.log(res[1])//php.cn// pop()从尾部将数组第一个元素删除(出栈)没有参数.let str2=[1,2,3];console.log(str2.pop());//1 2//push向数组尾部添加一个元素。console.log(str2.push(1));//1 2 3 1//unshift()在头部添加一个元素let str3=[1,2,3,4];console.log(str3.unsift(2));2 1 2 3 4//shift()在头部删除一个元素没有参数console.log(str3.shift())//2 3 4//join()将数组转化为字符串默认转为逗号连结的字符串let arr=["电脑","手机","idpa"];console.log(arr.join())//"电脑,手机,idpa"//创建lilet resiger=arr.join("</li><li>");console.log(`<li>${resiger}</li>`);//<li>电脑</li><li>手机</li><li>idpa</li>//slice()arr=[1,2,3,4,5,6]res=arr.slice(0,3);//123res=arr.slice(-3);//456//splice()删除返回删除的元素arr=[1,2,3,4,5,6]res=arr.splice(2);//3456//splice()新增元素//不删除元素,将第二个参数设为0,但是要传入第三个参数表示要插入的元素arr=[1,2,3,4,5,6,7,8];res=arr.splice(1,0,88,100);console.log(res)//1,88,99,2,3,4,5,6,7,8//简化res=arr.splice(1,0,...[88,100])//splice()改元素将第二个参数设为要删除的元素,但是要传入第三个参数,用来替换被删除的元素arr=[1,2,3,4,5,6,7,8,9]res=arr.splice(1,3,...[e,r]);console.log(res);//1,e,r,5,6,7,8,9//filter对每一个成员应用回调函数进行处理,返回true成员组成的数组取奇数与偶数arr=[1,2,3,4,5];res=arr.filter((item)=>item%2);console.log(res);//135res=arr.filter((item)=>!(item%2);console.log(res);//2,4//reduce()归并参数将多个成员统计之后,单值返回prev前一个值,curr后一个值,接受第三个参数表示从该值进行计算res=[1,2,3,4,5,6];res=arr.reduce(function(prev,curr){return prev+curr;})console.log(res)//1+2+3+4+5+6=21res=[1,2,3,4,5,6];res=arr.reduce(function(prev,curr){return prev+curr;},10)console.log(res)//10+1+2+3+4+5+6=31</script></body></html>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号