有效沟通问答-【官方】百战程序员_IT在线教育培训机构

会员可以在此提问，百战程序员老师有问必答

对大家有帮助的问答会被标记为“推荐”
看完课程过来浏览一下别人提的问题，会帮你学得更全面

截止目前，同学们一共提了 132647个问题

<!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>
    <style>
          .div1{
            background-color: blue;
            width: 500px;
            height: 500px;
        }
        .div2{
            background-color:pink;
            width: 200px;
            height: 200px;
            margin: 150px;
        }
    </style>
</head>
<body>
    <div class="div1">这是div1
        <div class="div2">这是div2</div>
    </div>
    <button class="btn">删除</button>
    <script>
        var div1=document.querySelector('.div1');
        var div2=document.querySelector('.div2');
        var btn=document.querySelector('.btn');
        function fun1(){
            console.log('这是div1');
        }
        function fun3(){
            console.log('这是div1第二次');
        }
        function fun2(){
            console.log('这是div2');
        }
        div1.attachEvent('click',fun1);
        div2.attachEvent('click',fun2);
        div1.attachEvent('click',fun3);
    </script>
</body>
</html>

老师，他说不支持这个方法

WEB前端全系列/第二阶段：JavaScript编程模块/浏览器模型(BOM) 271楼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>随机生成一个4到6位的字符串</title>
    
</head>
<body>
<script>
   //获取随机整数函数，就是下面的索引和4-6位字符串长度的产生
   function getRandomNum(min,max){
       return Math.floor(Math.random()*(max-min)+min);
   }
   //获取字符串函数
    function getRandomStr(length){
            //定义字符串
            var characterDic = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890";
            var finalAtr='';
            for (var i=0;i<length;i++){
                //获取随机索引
                var index = getRandomNum(0,64);
                //获取到随机字符
                var tempStr = characterDic[index];
                finalAtr += tempStr;//字符串联起来
            }
            return finalAtr;
    }
    var num = getRandomNum(4,7);//4-6位字符串
    var str = getRandomStr(num);
    console.log(str);


</script>
</body>
</html>

问题：
    4-6位字符串的效果有，但是也会出现4-6位字符串
+undefined的效果，不知道这是怎么回事，请老师指点迷津，谢谢！

WEB前端全系列/第二阶段：JavaScript编程模块/Math与Date 272楼

<!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>
<div class="div1">
    <div class="div2">
        这是div2
    </div>
    <div class="div3">这是div3</div>
    <button class="add">增加</button>
    <button class="remove">删除</button>
</div>
    <script>
 
     var addbut=document.querySelector('.add');
     var div1=document.querySelector('.div1');
     var div2=document.querySelector('.div2');
     var div3=document.querySelector('.div3');
     var divs=document.querySelectorAll('div')
  var  rebut=document.querySelector('.remove');
 
  addbut.onclick=function(){//新增一个class为newDiv的div
      var div=document.createElement('div');
      var div_class=document.createAttribute('class');
      div.setAttributeNode(div_class);
      div_class.value='newDiv';
      div.innerHTML='div';
      div1.insertBefore(div,div3);
      console.log(div1.childNodes);
  }

  rebut.onclick=function(){//删除最后一个class为newdiv 的div
    var divs=document.querySelectorAll('newDiv');
 div1.removeChild(divs[divs.length-1])
 
     
  }
     

 


    </script>
</body>
</html>

老师我想点击删除按钮的时候删除最后一个新增的div 怎么报错删除的不是节点

WEB前端全系列/第二阶段：JavaScript编程模块/DOM模型 273楼

<!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>键盘事件案例</title>
</head>
<body>
    <p>
        <span>密码:</span>
        <input type="password">
        <span class="showSpan">大写锁定已关闭</span>
    </p>
    <script>
        var input = document.querySelector('input');
        var showSpan = document.querySeletor('.showSpan');
        var flag=false;//表当前是关闭状态
        input.onkeydown = function(){
            if(event.keyCode==20){
                if(flag=false){
                    flag=true;//改变flag的状态，保证与capslock状态一致
                    showSpan.innerHTML = '大写锁定已打开';
                }else{
                    flag=false;
                    showSpan.innerHTML = '大写锁定已关闭';
                }
            }
        }
    </script>
</body>
</html>

老师不论点击Capslock键几次 input框后面span内容一直都是大写锁定已关闭不会切换为大写锁定已打开

WEB前端全系列/第二阶段：JavaScript编程模块/浏览器模型(BOM) 274楼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<script>
    //函数当做函数的返回值
    function info(){
        console.log("我是谁"+"会唱歌");
        function caiyi() {
            console.log('表演才艺')
        }
        return caiyi;
    }
   info();//打印的是  我是谁会唱歌
    
   console.log(info());//打印的是 我是谁会唱歌+函数caiyi();

   var result=info();
   result();//打印的是 我是谁会唱歌+表演才艺
</script>
</body>
</html>

有两个无问题请老师帮忙解答一下谢谢

问题1：

 info();和console.log(info());这两个打印出来的效果为什么不一样。
 
 问题2：
   return caiyi;返回的是什么，函数caiyia();还是函数里面的内容。

WEB前端全系列/第二阶段：JavaScript编程模块/Math与Date 275楼

<!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>
<div class="div1">
    <div class="div2">
        这是div2
    </div>
    <button>点我</button>
</div>
    <script>
        /*node方法
        1.appendChild()
        node1.appendChild(node2)  将节点2插入在node1最后面
        注意 js创建的节点对象之间没有文本对象
        2、hasChildNodes()  此方法返回一个布尔值  是否有子节点
        3、cloneNode（布尔值） 克隆节点，布尔值如果true 则克隆子节点 如果为flase 则不克隆子节点
          克隆节点不会克隆原节点的事件 但是会复制属性和内容   

        */
     var div1=document.querySelector('.div1');
     var div3=document.createElement('div');
     var div4=document.createElement('div');
     var but=document.querySelector('button');
     div3.innerHTML='lalal';
     div1.appendChild(div3);
     div1.appendChild(div4)
     console.log(div1.childNodes);
     var num=1;
     var str='这是第'+num+'克隆';
     but.onclick=function(){
        var clonebut=but.cloneNode(true);
       clonebut.innerHTML=str;
         div1.appendChild(clonebut);
      num+=1;
         console.log(num);
     }

    </script>
</body>
</html>

老师这个事件里面的num累加怎恶保存到全局变量num

WEB前端全系列/第二阶段：JavaScript编程模块/DOM模型 276楼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    var obj={};
    obj['name']='zhangsan';
    obj['method']=function eat(){
        console.log("饿了么");
        return;
    };
    //调用方法
         obj.method();
         console.log(obj);

</script>
</body>
</html>

老师 打印出来的结果不理解，如图，请帮忙解释一下，谢谢

WEB前端全系列/第二阶段：JavaScript编程模块/函数与对象 277楼

<!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>
        var arr = ['首页', '军事', '论坛', '视频'];
        //创建、设置ul元素
        var u = document.createElement('ul');
        var u_css = document.createAttribute('style');
        u_css.value = 'list-style:none;margin:0;padding:0';
        u.setAttributeNode(u_css)
        //创建li a元素 并设置元素
        for (var i = 0; i <= arr.length - 1; i++) {
            var li = document.createElement('li');
            var li_css = document.createAttribute('style');
            li_css.value = 'display:inine-block;widht:100px;height:30px;line-height=30px;background=skyblue;aligin=center';
            li.setAttributeNode(li_css);
            var a = document.createElement('a');
            var a_css = document.createAttribute('style');
            a_css.value = 'text-decoration: none;';
            a.innerHTML = arr[i];
            a.setAttributeNode(a_css);

            console.log(a.innerHTML);

            li.appendChild(a);
            u.appendChild(li);

        }
        document.body.appendChild(u);
    </script>
</body>

</html>

老师为啥我 li的css出不来

WEB前端全系列/第二阶段：JavaScript编程模块/DOM模型 278楼

18分46秒的时候这里卡了一下对于中括号和点运算符在这个for in当中的区别没说明白想问下老师为什么要用中括号

WEB前端全系列/第二阶段：JavaScript编程模块/函数与对象 279楼

老师,文本框里为什么不能显示我赋的值呀?

<input type="text" id="box">
<button id="add">上子弹</button>
<button id="del">射击</button>

//给id为box的input文本框赋初始值
// 先定义一个空的数组
var boxarr=[];
//然后获取数组的长度
document.getElementById("box").value=boxarr.length;

WEB前端全系列/第二阶段：JavaScript编程模块/字符串与数组 280楼

老师，打印等腰三角形的练习，没有达到效果，请帮忙看一下，谢谢

代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

</head>
<body>
<script>
 var alt="";
  for (var i=1;i<=5;i++){
      var blank="&nbsp";
      for (var j=1;j<=5;j++){//空白三角形
          blank=+"&nbsp" ;
      }
      var stars="";
      for (var m=1;m<=2*i-1;m++){
          stars+="*";
      }
      alt+=blank+stars+'<br/>';
  }
    document.write(alt);

</script>
</body>
</html>

效果图：

WEB前端全系列/第二阶段：JavaScript编程模块/运算符_数据类型和流程循环语句 281楼

<!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>Math</title>
</head>

<body>
    <script>
        /* Math
        1. Math.round 取整 >=0.5 取1 <0.5 取0
        2.Math.floor() 向下取整  返回小于参数值的最大整数
        var num=Math.floor(2.8)  //2
         2.Math.floor() 向上取整  返回大于参数值的最大整数
        var num=Math.floor(2.1)  //3
        3.Math.abs() 绝对值
        4. 3.Math.Max() 最大值
        5.Math.min() 最小值
        6.Math.pow(2,3)  //8 ，2的三次方
        7.Math.sqrt(num)  //返回num的平方根，如果num为负数 返回NaN
        8.Math.random()  返回[0,1)的随机数
        */
        // console.log(Math.round(1.3));
        // var num1=Math.floor( Math.random()*5+10);
        // console.log(num1);

        //大乐透
        var str = '';
        for (var i = 1; i <= 7; i++) {
            var num =0;
            if (i <= 5) {
                 num = Math.floor(Math.random() * 31 + 1);  
                  str+=num+',';
             
                }  else{
                    if(i<7){   num = Math.floor(Math.random() * 15 + 1);  
                    str =num+','+str;
                   }else{
                    num = Math.floor(Math.random() * 15 + 1);  
                    str =str +num;
                   }
                 
                }
               
             
               
        }
        console.log(str);
     


    </script>
</body>

</html>

老师我设计了最后两个数字在1-16 的随机数为啥还超了16

WEB前端全系列/第二阶段：JavaScript编程模块/Math与Date 282楼

老师 11:42秒这里第四个是t 第九个是e 第九个的e是包含在截取范围的呀不是不包含第二个参数的字符啊第二个参数的字符不就是第九个的e吗?又不是e后面的空格空格是第十个啊

WEB前端全系列/第二阶段：JavaScript编程模块/字符串与数组 283楼

这个视频和上一个字符串概述是一样的呀

WEB前端全系列/第二阶段：JavaScript编程模块/字符串与数组 284楼

老师这个match方法不能把信息打印在文档上吗只能输出在控制台吗

WEB前端全系列/第二阶段：JavaScript编程模块/字符串与数组 285楼

同学您好