JavaScrip-T5(2022年11月21日移动2112班)

举报
红目香薰 发表于 2022/11/29 15:23:45 2022/11/29
【摘要】 ​ 1、Object 对象和 Date 对象JavaScript 提供了一些非常有用的内部对象,按使用方式可分为两种实例对象。在引用该对象的属性和方法时,必须先使用 new 关键字创建一个对象实例,然后再使用“对象实例名 . 成员”的格式来进行访问 静态对象。在引用该对象的属性和方法时不需要使用 new 关键字来创建对象实例,可以直接使用“类名 . 成员”的格式来进行访问。Object对象O...

 1、Object 对象和 Date 对象

JavaScript 提供了一些非常有用的内部对象,按使用方式可分为两种

实例对象。在引用该对象的属性和方法时,必须先使用 new 关键字创建一个对象实例,然后再使用“对象实例名 . 成员”的格式来进行访问 静态对象。在引用该对象的属性和方法时不需要使用 new 关键字来创建对象实例,可以直接使用“类名 . 成员”的格式来进行访问。

Object对象

Object 对象提供了一种创建自定义对象的简单方式,因为它不需要开发人员定义构造函数 在程序运行时可以为JavaScript 对象添加属性,因此使用 Object 对象创建出自定义对象非常简便。

示例:

<script type="text/javascript">
    var person = new Object();
    person.name = "Tom";
    person.age = 25;
    function getAttr(attr) {
        document.getElementById("show1").innerHTML += person[attr] + "&nbsp;";
        document.getElementById("show2").innerHTML = person[attr] + "&nbsp;";
    }
</script>
<p><input type="button" value=" 显示姓名 " onClick="getAttr('name')" /> </p>
<p><input type="button" value=" 显示年龄 " onClick="getAttr('age')" /></p>
<hr/>
<div id="show1">
    默认显示的位置:
</div>
<hr/>
<div id="show2">
    默认显示的位置:
</div>

        /**
         * 1、对象的声明赋值使用的是{}花括号,大括号
         * 2、对象中的值以key:value的格式进行赋值,多个值中间使用【,】区分
         * 3、获取对象中的值的方法需要通过[]并给与key名的方式获取:item["name"]
         * / 

代码效果:

编辑

Date对象

通过创建 Date 对象,可以获取本地计算机中的日期与时间。

主要需要记忆的是各种Date的获取函数,是函数,所以使用的时候需要添加()。

其中:dateObject 所指的月份中的某一天,使用本地时间。返回值是 1 ~ 31 之间的一个整数。

这里看好,getDate() 是获取当前的日期,每个月的,例如,如果是2月份就只有28或29天了。根据闰年自动出的。

new Date() // 当前日期和时间
new Date(milliseconds) // 返回从 1970 年 1 月 1 日至今的毫秒数
new Date(dateString)
new Date(year, month, day, hours, minutes, seconds, milliseconds)

获取与格式化Date案例:

<script type="text/javascript">
    var now = new Date();
    document.write(now + "<br/>");
    var date1 = new Date("October 13, 1975 11:13:00")
    document.write(date1 + "<br/>");
    var date2 = new Date(79, 5, 24)
    document.write(date2 + "<br/>");
    var date3 = new Date(79, 5, 24, 11, 33, 0)
    document.write(date3 + "<br/>");
    var date4 = new Date(60 * 60 * 1000);
    document.write(date4);
</script>

显示效果:

编辑

时间获取示例: 

<script type="text/javascript">
    function showTime() {
        var now = new Date();
        var year = now.getFullYear(); // 获取年份
        var month = now.getMonth() + 1; // 获取月份
        var day = now.getDate(); // 获取日
        var hour = now.getHours(); // 获取小时
        var minutes = now.getMinutes(); // 获取分钟
        var seconds = now.getSeconds(); // 获取秒
        var week = now.getDay(); // 星期
        document.getElementById("myclock").innerHTML = year + " 年 " + checkTime(month) + " 月 " + checkTime(day) + " 日 星期" + (week == 0 ? 7 : (week + 1)) + " " + checkTime(hour) + ":" + checkTime(minutes) + ":" + checkTime(seconds);
    }
    function checkTime(i) {
        if (i < 10) {
            i = "0" + i; // 在小于 10 的数字前加一个 0
        }
        return i;
    }
    // 每隔 500 毫秒取一次当前的时间
    window.setInterval("showTime()", 500);
    window.onload = showTime;
</script>

效果:

编辑

  1. milliseconds 参数是一个 Unix 时间戳(Unix Time Stamp),它是一个整数值,表示自 1970 年 1 月 1 日 00:00:00 UTC(the Unix epoch)以来的毫秒数。
  2. dateString 参数表示日期的字符串值。
  3. year, month, day, hours, minutes, seconds, milliseconds 分别表示年、月、日、时、分、秒、毫秒。 


人工日历(简化)

<div>
    <script>
        var select_year = "<select onchange='updateDate()' id='year'>";
        for (let i = 1970; i <= 2050; i++) {
            select_year += "<option value='" + i + "'>" + i + "年</option>";
        }
        select_year += "</select>";
        document.write(select_year);
        var select_month = "<select onchange='updateDate()' id='month'>";
        for (let i = 1; i <= 12; i++) {
            select_month += "<option value='" + i + "'>" + i + "月</option>";
        }
        select_month += "</select>";
        document.write(select_month);
        document.write("<hr/>");
        function updateDate() {
            var year = document.getElementById("year").value;
            var month = document.getElementById("month").value;
            month = ("0" + month).slice(-2);
            var str_time = year + "-" + month + "-01";
            console.log(str_time);
            document.getElementById("updateTime").value = str_time;
        }
    </script>
    <input type="date" id="updateTime" />
</div>

【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。