JavaScript 基础

在页面中,我们可以在body标签中放入<script type="text/javascript"></script>标签对儿.

<script type="text/javascript">
</script>

语法规则:

(1) JavaScript对换行,缩进,空格不敏感.

备注:每一条语句末尾要加上分号,虽然分好不是必须加的,但是为了程序今后要压缩,如果不加分毫,压缩之后将不能再运行.

(2) 所有的符号,都是英语的.比如括号,引号,分号.

(3) JavaScript的注释:

// 我是注释

/*
多行注释1 
多行注释2
*/

alert: (弹出"警告框").

<script type="text/javascript">
    alert("德玛西亚!")
</script>

console.log/prompt: (控制台输出)/(用户输入)

<script type="text/javascript">
        var a = prompt("今天是什么天气?");
        console.log(a);
</script>

typeof: (查看类型)

<script type="text/javascript">
        var a = 100;
        console.log(typeof a);
</script>

parseInt: (数字类型转换)

// 自带净化功能:只保留字符串最开头的数字,后面的中文自动消失.
console.log(parseInt("2018你真帅！！");

// 自带截断小数的功能.
var a = parseInt(5.8) + parseInt(4.7);
console.log(a);

if: (流程控制)

<script>
    
  var age = 14;

  if(age > 18){
    console.log('可以去会所了');
  }else if(age==14){
    console.log('好好上学');
  }

</script>

switch: (流程控制)

<script>
    var age = 31;
    switch(age){
        case 18:
        console.log('成年了');
        break;
        case 26:
        console.log('成年了2');
        break;
        case 30:
        console.log('成年了3');
        break;
        default:
       console.log('很遗憾')
    }
</script>

for: (循环)

for(var i = 0; i < 5; i++){ //控制行数
    for(var j = 0; j < 10; j++){//控制的每行的*数 

        document.write('*');
    }
    document.write('<br>');
}

Array: (数组)

<script>
        var north = ['北京','山东','天津'];
        var south = ['东莞','深圳','上海'];
                
        var newCity = north.concat(south);
        console.log(newCity);

        var arr = ['张三','李四','王文','赵六'];
        arr.push('alex');
        // console.log(n);
        console.log(arr);

        // 移除数组的第一个元素
        arr.shift();
        console.log(arr);

        // 往数组的第一个元素追加
        arr.unshift('alex');
        console.log(arr);

        for(var i = 0; i < arr.length; i++){
            console.log(arr[i]);
            document.write(arr[i]+' ');
        }
</script>

aplit/trim: (切割/去空格)

<script>
        var  str =  '我的天呢,a是嘛,你在说什么呢?a哈哈哈';
        console.log(str.split('a'));


        var str2 = '            alex             ';

        console.log(str2.trim());
</script>

Date: (时间)

<script>
    var date = new Date();
    console.log(date);
    console.log(date.getDate());
    console.log(date.getMonth()+1);

    console.log(date.toLocaleString());
</scrpit>

DOM:

<script>
    
//入口函数
// 窗口加载   先是文档加载，图片是后加载
   console.log(window.onload);

   // 1.必须等待图片资源加载完成之后才执行js脚本代码 异步的（不等待） 同步
    window.onload = function() {
        console.log(document);
        console.log(document.documentElement);
        console.log(document.body);

    };
    console.log(1111);

    // 2.有事件覆盖
    // window.onload = function() {
    //     // console.log(111);
    // }

</script>