JavaScript基础

最新推荐文章于 2022-11-23 17:32:46 发布

可芭乐

最新推荐文章于 2022-11-23 17:32:46 发布

阅读量303

点赞数

分类专栏： JavaScript基础文章标签： javascript

本文链接：https://blog.csdn.net/a839371666/article/details/54584409

版权

JavaScript基础专栏收录该内容

37 篇文章 0 订阅

订阅专栏

ECMAScript：翻译核心解释器几乎没有兼容性问题
DOM：document Object Model 专门处理HTML文档有一些操作不兼容
BOM：browser Object Model 专门处理浏览器没有兼容问题（完全不兼容）
对于弹出结果为NaN的检验方法使用isNaN来检验

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<script type="text/javascript">
    window.onload = function() {
        var oTxt1 = document.getElementById('txt1');
        var oTxt2 = document.getElementById('txt2');
        var oBtn = document.getElementById('btn1');

        oBtn.onclick = function(){
            var n1 = parseInt(oTxt1.value);
            var n2 = parseInt(oTxt2.value);

            if (isNaN(n1)) {
                alert('您输入的第一个数字有误');
            }else if (isNaN(n2)) {
                alert('您输入的第二个数字有误');
            }else{
                alert(n1 + n2);
            }
        }
}
</script>
</head>
<body>
    <input id="txt1" type="text" />
    <input id="txt2" type="text" />
    <input id="btn1" type="button" value="求和" />
</body>
</html>

求两个数的和
检验填入的是否为数字

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<script type="text/javascript">
    window.onload = function(){
        var aLi = document.getElementsByTagName('li');

        for (var i = 0; i < aLi.length; i++) {
            if (i % 2 == 0) {
                aLi[i].style.background = '#ccc';
            }else {
                aLi[i].style.background = '';
            }
        };
    }
</script>
</head>
<body>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</body>
</html>

利用求模来控制灰白肤色

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<script type="text/javascript">
    var s = 99999999;
    alert(parseInt(s / 60) + '分' + s % 60 + '秒');
</script>
</head>
<body>

</body>
</html>

时间转换，将秒转换为…分…秒

switch使用方法：

switch（变量）{
    case 值1：
        break；
    case 值2：
        break；
    case 值3：
        break；
    ……
    default：
        语句n；
}

有关性别的分类：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<script type="text/javascript">
    var name = 'asd';
    var sex = '男';
    switch(sex){
        case '男':
            alert(name + '先生，你好');
            break;
        case '女':
            alert(name + '女士，你好');
            break;
        default:
            alert(name + '你好');
            break;
    }
</script>
</head>
<body>

</body>
</html>

当为男性时，弹出结果为：asd先生，你好
当为女性时，弹出结果为：asd女士，你好
当不填性别时，弹出结果为：asd你好

三目运算符（三元运算符）
?:
if(条件){
语句1
}else{
语句2
}
利用三目运算符可写成
条件？语句1：语句2

break 打断整个循环
continue 打断本次循环

真假判断：
真：true 非零数字非空字符串非空对象
假：false 数字零空字符串空对象 underfined

json使用方法：
var a = 12;
var b = 2;
var c = ‘abc’;
相当于用json表达为：
var json = {a: 12,b: 2,c: ‘abc’};
任意使用其中任何元素可用：
json.a、json.b、json.c

json跟数组的对比：

    var json = {a: 12,b: 8,c: 7};
    var arr = [12,8,7];

    alert(json['a']);
    alert(json.a);
    alert(arr[0]);

弹出结果相同，数组跟json只有下标不同
数组有length，json没有length
在数组循环过程中：
for(var i=0;i<arr.length; i++)和for(var i in arr)两者用法相同
for(var i in json)用于json循环

可芭乐

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript基础

ECMAScript：翻译核心解释器几乎没有兼容性问题 DOM：document Object Model 专门处理HTML文档有一些操作不兼容 BOM：browser Object Model 专门处理浏览器没有兼容问题（完全不兼容）对于弹出结果为NaN的检验方法使用isNaN来检验<!DOCTYPE html><html lang="en"><head> <meta
复制链接

扫一扫

专栏目录