zoukankan      html  css  js  c++  java
  • JavaScript基础认知

    此文只适用于初学者,大神们就不要看了,嘿嘿~

    一、定义变量

      关键字 var,由此关键字定义变量,例如:var a =21;就把21这个数定义给了变量a

    二、基本数据类型

      1、Number类型  表示数字,例如:10,3.14;

      var number = 10;

      alert(number);

      2、String类型  表示字符串

      var string = ‘hello’;

      alert(string);

      ·注意:等号后面必须有单引号或双引号。

      3、Boolean类型  布尔类型,用来表示真假  true  false

      var b1 = true;

      var b2 = false;

      alert(b1);

      4、Object  对象类型(了解)

      var obj = new Object();

      alert(typeof obj);

    三、用户交互&代码调试的5绝杀

      用户界面交互基本操作是警告,提示和确认。

     代码调试:

      1、alert(Message);  消息窗口,也叫作模态窗口

      var c = 0;

      alert(c);

      这两句JS代码便会在页面刷新时 ,出现提示框,提示框的内容为“0”;

      2、prompt(提示信息);  该提示框会出现用户可以输入的窗口,类似于input中的text属性。

      var name = prompt('请输入姓名');

      alert(name);

      3、confirm  跟alert差不多,就是多了个取消

      confirm('下课不?');

      4、console.log  这个不是在网页上提示,而是在开发者工具中的控制台中输出

      var a =100;

      console.log(a);

      会在控制台上出现“100”这个数

      5、document.write  将内容写入到html文件中

      document.write('这是一个大千世界,啥货都有');

    四、算数运算符

       算数运算
             alert(5+5);
             alert(10-3);
             alert(5*6);
             alert(10/2);
             求余运算: alert(10%3);




            +号对字符串的作用
             alert('hello'+' word');//拼接
             alert('2'+1);
             -号对字符串的影响
            alert('5'-3);// 2



            自增,自减运算符 ++   --
             var a = 10;
             a++;//相当于a = a + 1;
             ++a;
             alert(a);

             var b = 10;
             b--;
            --b;
            alert(b);

           当++  -- 不是单独出现的时候
            var a = 10;
            var number = a++;// ++ 在后,先赋值,在自增;++ 在前,先自增,在赋值。
            alert(a);
            alert(number);

           复合运算符
           +=  -=  *=  /=  %=
            var a = 10;
            a = a + 5;
            a += 5;
            alert(a);

            a = a / 3;
            a /= 3;
            alert(a);
            a = a % 3;
            a %= 3;
            alert(a);
    五、元素的获取

      <body>

        <p id="para">这就是P标签</p>
           <p class="praa">通过类名获取元素</p>
           <p class="praa">通过类名获取元素</p>
           <p class="praa">通过类名获取元素</p>

      <script type="text/javascript">

        //1.通过id获取元素

          // var para = document.getElementById('para');
          // //修改元素的样式
          // para.style.color='red';
          // //2.通过类名获取元素

          var praa = document.getElementsByClassName('praa');
          //修改集合中第一个元素的样式
          praa[0].style.color = 'blue';
          praa[1].style.color = 'yellow';
          praa[2].style.color = 'orange';
          praa[1].style.color = 'green';


          //3.通过标签名获取元素

          // var paar = document.getElementsByTagName('p')

          // paar[0].style.color = 'green';

    六、一些细节:

      script标签放在底部的好处:
            虽然理论上放在哪里都是可以的,但是对于前端页面优化来说,放在底部最佳,如果js执行出错,最起码页面中的元素还能加载出来,因为文档是按照从上到下的顺序执行的。

      变量名:(自定义的,1、不能以数字开头,可以是字母/_/$/。2、不能使用系统保留字。3、大小写敏感,多个单词采用驼峰命名法{var className=21;}。4、见名知意。5、不能出现空格)

  • 相关阅读:
    R语言:随机抽样(sample函数)
    SNP (Single Nucleotide Polymorphism), SNV ( single nucleotide variants ) , Indel (insertion-deletion) 的区别
    剑指offer五十六之删除链表中重复的结点
    剑指offer五十五之链表中环的入口结点
    剑指offer五十四之字符流中第一个不重复的字符
    剑指offer五十三之表示数值的字符串
    剑指offer五十二之正则表达式匹配
    剑指offer五十一之构建乘积数组
    求游戏晋级花费的宝石的期望
    剑指offer五十一之构建乘积数组
  • 原文地址:https://www.cnblogs.com/llz1314/p/5768084.html
Copyright © 2011-2022 走看看