为什么id会重复,id不是唯一的吗
//求平均值 var arr=[2,5,1,6,8,4,9]; function getAverage(tempArr){ var sum=0; for(var i in tempArr){ sum+=tempArr[i]; } return sum/tempArr.length; //返回平均值 } var result=getAverage(arr); //函数的调用 console.log(result);
1、为什么函数的调用那行不写成
var result=getAverage(tempArr);
呢?
2、计算结果时都要用return结尾吗?意义是什么呢?
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script> var ul=document.createAttribute('ul'); ul.style.listStyle='none'; ul.style.padding='0'; var arr=["首页","军事","娱乐","历史","政治"]; for(var i=0;i<arr.length;i++){ var li=document.createAttribute("li"); li.style.cssText="display:inline-block;width:100px;height:30px;line-height:30px;" + "text-align:center;margin-left:5px;background-color:skyblue"; li.innerHTML=arr[i]; ul.appendChild(li); li.onmouseenter=function(){ this.style.backgroundColor="blue"; } li.onmouseleave=function(){ this.style.backgroundColor="pink"; } } document.body.appendChild(ul); </script> </head> <body> </body> </html>
listStyle出错,onmouseenter和onmouseleave是我手动敲出来的,编辑器没有自动提示,我的webstrom版本是10.0.3
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .div1{width: 200px;height: 200px;background-color: darkseagreen;} .div2{width: 100px;height: 100px;background-color: pink;margin: 25px auto;} </style> </head> <div> <div class="div1">div1 <div class="div2" onclick="test3()">div2</div> </div> </div> <body> <script> var div1=document.querySelector('div1'); var div2=document.querySelector('div2'); function test3() { console.log('这是第二个函数'); div2.setAttribute('onclick',null); } </script> </body> </html>
老师帮忙看下报错了,什么原因?
<div style="width:200px;height: 200px;background-color: pink"></div> <script> var div = document.querySelector('div'); //鼠标按下时触发 div.onmousedown=function(){ div.style.backgroundColor='blue'; } //鼠标抬起时触发 div.onmouseup=function(){ div.style.cssText='background-color:red'; }
为什么鼠标抬起时功能不能实现?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script> // 例子 function info() { console.log("我是xxx"); console.log("我会唱xx"); function caiyi() { console.log("我要表演才艺") } return caiyi() ; } info(); // console.log(result); // 例子2 function info2() { console.log("我是xxx"); console.log("我会唱xx"); function caiyi2() { console.log("我要表演才艺") } return caiyi2 ; } info2()(); //例子3 function info3() { console.log("我是xxx"); console.log("我会唱xx"); function caiyi3() { console.log("我要表演才艺") } return caiyi ; } info3(); </script> </body> </html>
老师,例1返回值返回的是一个语句,所以只需要调用一次;例2返回值返回的是一个函数,所以需要调用两次;例子3虽有返回值,但是没有调用,所以没用输出“我要表演才艺”;我可以这样理解吗?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script> // 随机 function get() { var str = '0123456789abcdef';// 定义取值范围 var color = '#'; for (var i = 0; i < 6; i++) { var num = Math.floor(Math.random() * str.length);// Math.floor 向下取整,Math.random随机 color += str[num]; } console.log(color.length); console.log(color); } get(); // hi~老师,我没弄清楚下面这段代码到底是怎么执行的 /* random方法是随机获取0~1之间的小数,floor方法是向下取整,那么不管random获取到什么小数 floor咔擦一下就把小数全部去掉了,那剩下的也就只有0一个整数了 那为什么用 Math.floor(Math.random() 乘以数字它就能取到一个随机的数字呢 */ console.log(Math.floor(Math.random() * 100));// 取到100以内的随机数。。。 console.log(Math.floor(Math.random() + 100));// 100 </script> </body> </html>
老师~这个我想不明白,求解!!
老师,我想利用dom2事件,实现验证用户名和邮箱,点击验证按钮执行,但是我这个代码不知道是怎么回事
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>正则练习</title> </head> <body> <p> <input type="text" class="userName" placeholder="用户名为英文、数字和下划线组成,最小6位不超过10位"> <span class="userSpan"></span> </p> <p> <input type="text" class="number" placeholder="邮箱必须是QQ邮箱格式"> <span class="emailSpan"></span> </p> <button>验证</button> <script> /* QQ邮箱是以数字开头,且前面只能位数字,以@qq.com结尾 */ var email=document.querySelector('.number'); var userName=document.querySelector('.userName'); var btn=document.querySelector('button'); var emailSpan=document.querySelector('.emailSpan'); var userSpan=document.querySelector('.userSpan'); btn.addEventListener(click,function(){ var userName_value=userName.value; var wtq= /^[\w]{6,10}$/; var q=userName_value.test(wtq); if(q){ userSpan.innerHTML="用户名格式正确"; }else{ userSpan.innerHTML="用户名格式错误"; } },true); btn.addEventListener(click,function(){ var str=email.value; var front=str.substring(0,str.length-7);//字符串删去@qq.com之后形成的字符串 var reg1=new RegExp('@qq.com$');//字符串的结尾只能是@qq.com var reg2=new RegExp('^[0-9]{6,11}$');//新形成的字符串(字符串的开头)只能为数字 var t=reg2.test(front); var w=reg1.test(str); if(w&&t){ emailSpan.innerHTML="邮箱格式正确"; }else{ emailSpan.innerHTML="邮箱格式不正确"; } },true); </script> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <button> 跨域传输 </button> <script> var but=document.querySelector('button'); but.onclick=function(){ var iframe=document.createElement('iframe'); iframe.src='page.html';//加载页面 iframe.style.display='none'; document.body.appendChild(iframe); } window.onload=function(eve){ var iframeWindowName=eve.target.contentWindow.name; eval(iframeWindowName); console.log(num); } </script> </body> </html>
老师,为啥报错的 contentWindow.name和eval()是啥意思
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>自定义左键菜单案例</title> <style type="text/css"> *{ padding: 0; margin: 0; } ul{ list-style: none; background: #9f9f9f; min-width: 250px; display: inline-block; position: absolute; display: none; } ul li{ height: 30px; line-height: 30px; padding: 5px 20px; cursor: pointer; transition: 0.3s; } ul li:hover{ background: #b3d4fc; color: #ffffff; } </style> </head> <body> <ul> <li>一</li> <li>二</li> <li>三</li> <li>四</li> <li>去百度搜索页面中选中的内容</li> </ul> <textarea cols="80" rows="30"></textarea> <script> var ul =document.querySelector("ul"); //禁用右键菜单 document.oncontextmenu=function (eve) { return false; }; document.onmouseup=function (eve) { //判断鼠标用的哪个按钮 // 0 左键 1 滑轮 2 右键 if(eve.button==2){ ul.style.display="inline-block"; //设置鼠标点击的位置 ul.style.left=eve.clientX+"px"; ul.style.right=eve.clientY+"px"; }else{ //关闭菜单 ul.style.display="none"; } } //点击某个惨淡选项时触发的事件(事件委托 ul.onmousedown=function (eve) { if(eve.target.innerHTML=="一"){ alert("去吧"); }else if(eve.target.innerHTML=="二"){ if(confirm("二")){ window.close(); } }else if(eve.target.innerHTML=='去百度搜索页面中选中的内容'){ var resukt=document.getSelection().toString(); window.open('http://www.baidu.com/s?wd='+resukt); }else{ var result= prompt('输入内容然后去百度搜索'); window.open('http://www.baidu.com/s?wd='+result); } } </script> </body> </html>
这种应该没有错吧,感觉和视频里有点不一样
最后的练习第2道题的打印和无打印什么意思呢?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> div{ width: 50px; height: 50px; background-color: pink; position: absolute; top: 50px; } </style> </head> <body> <div></div> <input type="range" max="100" min="0" value="0" > <script> var div=document.querySelector('div'); var input=document.querySelector('input'); input.onmousedown=function(){ input.onmousemove=function(){ var move=event.clientX; div.style.left=move+'px'; console.log(event.clientX); } } </script> </body> </html>
老师。鼠标移动这个事件在没触发mousedown事件也能触发的吗
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <button>跨域传输</button> <script> //如果想要另一个页面的信息,必须先加载这个页面 var btn=document.querySelector("button"); btn.onclick=function(){ var iframe=document.createElement("iframe"); iframe.src="02跨域传输.html";//加载保留信息的页面 iframe.style.display="none"; document.body.appendChild(iframe); //当iframe加载完毕,意味着window.name的内容已经被赋予完毕 iframe.onload=function(eve){ var iframeWindow= eve.target.contentWindow.name; console.log(iframeWindow);//打印的是放在name里面的全部字符串 eval(iframeWindow);//将字符串解析成代码使用 console.log(num);//这里就可以用其他界面的内容 } } </script> </body> </html>
老师这个是什么问题
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div> <div class="div1">div1</div> <div id="div2">div2</div> </div> <button id="but">点我</button> <script> var div=document.querySelector('div'); var div1=document.querySelector('.div1'); var div2=document.querySelector('#div2'); var but=document.querySelector('button'); but.onclick=function () { var span=document.createElement('span'); span.innerHTML='SPAN'; span.style.color='red'; div.replaceChild(span,div2); } </script> </body> </html>
老师,控制台报错,哪里错了?
非常抱歉给您带来不好的体验!为了更深入的了解您的学习情况以及遇到的问题,您可以直接拨打投诉热线:
我们将在第一时间处理好您的问题!
关于
课程分类
百战程序员微信公众号
百战程序员微信小程序
©2014-2025百战汇智(北京)科技有限公司 All Rights Reserved 北京亦庄经济开发区科创十四街 赛蒂国际工业园网站维护:百战汇智(北京)科技有限公司 京公网安备 11011402011233号 京ICP备18060230号-3 营业执照 经营许可证:京B2-20212637