<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>数据解析</title> </head> <body> <form action=""method="get"> 姓名: <input type="text" name="userName"><br> 姓名: <input type="text"name="age"><br> 姓名: <input type="text" name="sex"><br> <input type="submit"/> </form> <br> <button>解析数据</button> <script> var but=document.querySelector('button'); function dataParse(outInfo){ var obj={}; var inforStr=outInfo; //获取？后面的数据 var realInfo=inforStr.slice(1); var proArr=realInfo.split("&"); for (var i=0;i<proArr.length;i++){ var tempArr= proArr[i].split("="); obj[tempArr[0]]=tempArr[1]; } return obj; } but.onclick=function () { var dataObj=dataParse(window.location.search); console.log(decodeURIComponent(dataObj)); } </script> </body> </html>
老师麻烦给看看是哪里错了第二个问题这个outInfo是怎么回事？不明白 谢谢老师这个是beixi赋值给username，还有age跟sex没有赋值吧。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>自定义右击菜单案例</title> <style> *{padding: 0;margin: 0} ul{ list-style: none; background-color: darkgray; min-width: 220px; 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-color: olivedrab; color: #fff; } </style> </head> <body> <ul> <li>北京尚学堂</li> <li>欢迎你</li> <li>去百度搜索页面中选中的内容</li> <li>赚大钱</li> </ul> <textarea cols="80" rows="20"></textarea> <script> var ul=document.querySelector("ul"); document.oncontextmenu=function (eve) { return false;//表示事件禁用 } document.onmouseup=function (eve) { //eve.button能够判断鼠标用的是哪个按钮 //0左键 1滑轮 2邮件 if (eve.button==2){ ul.style.display="inline-block"; //设置鼠标点击的位置 ul.style.left=eve.clientX+"px"; ul.style.top=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 result=document.getSelection().toString(); window.open('http://www.baidu.com/s?wd='+result); }else { var result=prompt("输入内容然后去百度"); window.open('http://www.baidu.com/s?wd='+result); } } </script> </body> </html>
老师我写的这个怎么不跳转百度？为什么要变成字符串的形式？
eve.target.contentwindow.name,老师能解释视频当中的contentwindow是啥意思吗？ 在10分10秒左右。谢老师
eve.target.contentwindow.name,老师能解释视频当中的contentwindow是啥意思吗？
老师，我在做分辨率和缩放率的测试时，发现在div设置了背景图后，div内的文字本来是居中的，一般的分辨率也正常，但是在电脑的缩放率300%和分辨率变得很大，到达4000左右的时候，就会出现文字不居中了的情况了？这是为什么呢？背景图在设置为宽100%，高为auto，不就是自适应页面大小的，文字设置了center，我觉得就不会出现这种情况的。实在不明白了，麻烦老师了，正常图和问题图如下：
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" /> <meta http-equiv="X-UA-Compatible" content="IE=9" /> <title>flex</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet"> <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 --> <!-- 警告：通过 file:// 协议（就是直接将 html 页面拖拽到浏览器中）访问页面时 Respond.js 不起作用 --> <!--[if lt IE 9]> <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script <![endif]--> <script src="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.min.css"></script> <script src="https: //cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script> <script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script> <style> *{ margin: 0px; padding: 0px; } html,body{ width: 100%; height: 100%; background: #0d3349; } body{ min-width: 768px; } #div{ width: 100%; height: 100%; background: #00c2de; } #div1{ background: #bd362f; background-image:url(static/images/shouye-biaoti.png); background-size: 100% auto; background-repeat: no-repeat; width: 100%; height: 15%; margin-top: 1%; } h1{ text-align: center; font-size: 0.7rem; font-weight: 700; } </style> </head> <script> function setRem() { var whdef = 100 / 1920 var bodyWidth = document.body.clientWidth console.log(bodyWidth) console.log(window.screen.width) var rem = bodyWidth * whdef document.getElementsByTagName('html')[0].style.fontSize = rem + 'px' } window.addEventListener('load', setRem) window.addEventListener('resize', setRem) </script> <body style="font-size: 60px"> <div id="div"> <div id="div1" > <h1 >标题</h1> </div> </div> </body> </html>
老师，在使用rem的时候，var bodyWidth = document.body.clientWidth和var bodyWidth = window.screenWidth 为什么字体都为0.5rem,显示结果不是一样的？在缩放率和分辨率都变得情况下，body.clientWidth和window.screenWidth都是变得呀。那都是按比例变得，我觉得用哪一个都一样的。
老师，display: table-cell;是不是只对父元素的宽高设置为数值px的时候才起作用的？宽高为百分比的时候是不是不起作用？
老师，视频中的defer，是不是也只对外部引入的js文件有效，还是内部手动写的js脚本 也有效，内部的语法是<script defer></script>，可是我这么写，没发现起作用。
老师，对于document.body.clientWidth/document.body.clientHeight
document.body.offsetWidth/document.body.offsetHeight
document.body.scrollWidth/document.body.scrollHeight
document.body.scrollTop/document.body.scrollLeft
这几个有点不太明白，我理解是offsetWidth=clientWidth+border；可是在变网页窗口的时候，offsetWidth比clientWidth小。不知道为什么我这么写之后，网页就不显示div了。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> </style> <body style="height: 1000px"> <div style="background: #0d3349;width: 300px;height: 2000px"></div> </body> <script type="text/javascript"> window.onload=function(){ document.write("网页可见区域宽："+document.body.clientWidth+"</br>"); document.write("网页可见区域高client："+document.body.clientHeight+"</br>"); document.write("网页可见区域宽："+document.body.offsetWidth+"</br>"); document.write("网页可见区域高offset："+document.body.offsetHeight+"</br>"); document.write("网页正文全文宽："+document.body.scrollWidth); document.write("网页正文全文高："+document.body.scrollHeight); document.write("网页被卷去的高："+document.body.scrollTop); document.write("网页被卷去的左："+document.body.scrollLeft); document.write("网页正文部分上："+window.screenTop); document.write("网页正文部分左："+window.screenLeft); document.write("网页正文部分上："+window.screenX); document.write("网页正文部分左："+window.screenY); document.write("屏幕分辨率的高："+window.screen.height); document.write("屏幕分辨率的宽："+window.screen.width); document.write("屏幕可用工作区高度："+window.screen.availHeight); document.write("屏幕可用工作区宽度："+window.screen.availWidth); document.write("浏览器高度："+window.outerHeight+"</br>"); document.write("浏览器宽度："+window.outerWidth+"</br>"); document.write("浏览器内页面可用高度："+window.innerHeight+"</br>"); document.write("浏览器内页面可用宽度："+window.innerWidth); } </script> </head> </html>
老师，这是另外一个同学的作业，是用函数写的，不太明白他的思路，您能大概讲解一下吗？还有他这个函数没有被调用，怎么会输出呢？
<script> var arr = [23,12,43,25,45,66]; var maxNum = px(arr); console.log('最大值是：'+maxNum+'\r\n'+'最大值下标为'+arr.indexOf(maxNum)); function px(arr){ var temp =0; for(var index in arr){ if(arr[index]> temp){ temp = arr[index]; }; } return temp; } </script>
老师，视频中对于function (eve){}，什么时候这个事件event必须写，什么时候可以不写，之前大部分例子都不写，是因为用到了鼠标事件吗？
老师，我想利用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>
这里的.div{position：absolute；}这个地方不明白。
老师 ，能详细讲一下这里的定位吗？不明白
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>带有提示文字的滚动条</title> <style> div{ width: 25px; height: 25px; border: 1px solid black; line-height: 25px; text-align: center; position: absolute; } </style> </head> <body> <input type="range" min="0" max="100" value="5"> <div></div> <script> var input=document .querySelector("input"); var div=document .querySelector("div"); var flage=false; input.onmousemove=function () { if (flage){ console .log('(x,y):('+event.clientX+','+event.clientY+')') div.style .left=event.clientX+'left'; } } input.onmousedown=function () { flage=true; } input.onmouseup=function () { flage=false; } </script> </body> </html>
老师 为什么我的event也有横线？
非常抱歉给您带来不好的体验！为了更深入的了解您的学习情况以及遇到的问题，您可以直接拨打投诉热线：
我们将在第一时间处理好您的问题！
关于
课程分类
百战程序员微信公众号
百战程序员微信小程序
©2014-2025百战汇智（北京）科技有限公司 All Rights Reserved 北京亦庄经济开发区科创十四街 赛蒂国际工业园网站维护：百战汇智（北京）科技有限公司 京公网安备 11011402011233号 京ICP备18060230号-3 营业执照 经营许可证：京B2-20212637
老师麻烦给看看是哪里错了
第二个问题这个outInfo是怎么回事？不明白 谢谢
老师这个是beixi赋值给username，还有age跟sex没有赋值吧。
京公网安备 11011402011233号