javascript-Web APLs (四)

日期对象

用来表示时间的对象
  作用:可以得到当前系统时间
在代码中发现了 new 关键字时,一般将这个操作称为 实例化
//创建一个时间对象并获取时间
//获得当前时间
const date = new Date()
//获得指定时间
const date = new Date('2006-6-6')
console.log(date)
因为日期对象返回的数据我们不能直接使用,所以需要转换为实际开发中常用的格式
//获得日期对象
const date = new Date()   //Fri Nov 08 2024 16:17:47
//使用里面的方法
console.log(date.getFullYear())    //获得年份:2024
console.log(date.getMonth() + 1)   //获得月份:11
console.log(date.getDate())        //获得日期:8
console.log(date.getDay())         //获取星期:5
//0~6所对应的是星期日,星期一,星期二,星期三,...,星期六

时间戳
算法:
  1.  将来的时间戳 - 现在的时间戳 = 剩余时间毫秒数
  2.  剩余时间毫秒数 转换为 剩余时间的 年月日时分秒 就是 倒计时时间
  3.  比如 将来时间戳 2000ms - 现在时间戳 1000ms = 1000ms
  4.  1000ms 转换为就是 0小时0分1秒
三种方式获取时间戳:
1. 使用 getTime() 方法
const date = new Date()
console.log(date.getTime())
2. 简写 +new Date()
console.log(+new Date())
3. 使用 Date.now()
  无需实例化
但是只能得到当前的时间戳, 而前面两种可以返回指定时间的时间戳
console.log(Date.now())

节点操作

DOM节点

  DOM树里每一个内容都称之为节点
节点类型:
  元素节点
所有的标签 比如 body、 div   ; html 是根节点
  属性节点:
  所有的属性 比如 href,class属性
  文本节点:
 所有的文本, 比如标签里面的文字
  其他

查找节点

节点关系:针对的找亲戚返回的都是对象
  父节点
  子节点
  兄弟节点
父节点查找:
parentNode 属性
返回最近一级的父节点 找不到返回为null
子元素.parentNode
子节点查找:
      childNodes
  获得所有子节点、包括文本节点(空格、换行)、注释节点等
     children 属性 (重点)
  仅获得所有元素节点
  返回的还是一个伪数组
父元素.children
兄弟关系查找:
1. 下一个兄弟节点
  nextElementSibling 属性
2. 上一个兄弟节点
  previousElementSibling 属性
学习路线:
  创建节点
即创造出一个新的网页元素,再添加到网页内,一般先创建节点,然后插入节点
document.createElement('标签名')  //这里的标签名最好是有意义的,别自创
  追加节点
要想在界面看到,还得插入到某个父元素中
     插入到父元素的最后一个子元素:
父元素.appendChild(要插入的元素)
    插入到父元素中某个子元素的前面
父元素.insetBefore(要插入的元素,在哪个元素前面)

增加节点

删除节点

M端事件

JS插件

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/914347.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

云计算在智能交通系统中的应用

💓 博客主页:瑕疵的CSDN主页 📝 Gitee主页:瑕疵的gitee主页 ⏩ 文章专栏:《热点资讯》 云计算在智能交通系统中的应用 云计算在智能交通系统中的应用 云计算在智能交通系统中的应用 引言 云计算概述 定义与原理 发展历…

图像算法之 OCR 识别算法:原理与应用场景

一、引言 在当今数字化时代,图像信息的处理和识别变得越来越重要。光学字符识别(Optical Character Recognition,OCR)算法作为一种能够将图像中的文字转换为可编辑文本的技术,正广泛应用于各个领域。从文档数字化到自…

云计算:定义、类型及对企业的影响

💓 博客主页:瑕疵的CSDN主页 📝 Gitee主页:瑕疵的gitee主页 ⏩ 文章专栏:《热点资讯》 云计算:定义、类型及对企业的影响 云计算:定义、类型及对企业的影响 云计算:定义、类型及对企…

Chromium127编译指南 Mac篇(六)- 编译优化技巧

1. 前言 在Chromium127的开发过程中,优化编译速度是提升开发效率的关键因素。本文将重点介绍如何使用ccache工具来加速C/C代码的编译过程,特别是在频繁切换分支和修改代码时。通过合理配置和使用这些工具,您将能够显著减少编译时间&#xff…

打假官方咨询(续)

大家还记得我们的上一次测试吗:9.9大还是9.11大,我又把这个问题拎了出来,看一下各家AI的最新表现: 商量(出自商汤科技): 我们可以发现,商量好像没长记性,上次错了&#…

AFL++实战入门与afl-fuzz流程解析(源码流程图)

简介 本项目为模糊测试的零基础教学,适合了解 pwn 且会使用 Linux 的 gcc、gdb 的读者。模糊测试旨在通过向程序投喂数据使其崩溃,从而获取崩溃样本以寻找程序漏洞。本文前半部分介绍 AFL++ 的 docker 环境配置,帮助读者解决入门时的环境和网络问题; 后半部分全面解析 afl…

单体架构 IM 系统之长轮询方案设计

在上一篇技术短文(单体架构 IM 系统之核心业务功能实现)中,我们讨论了 “信箱模型” 在单体架构 IM 系统中的应用,“信箱模型” 见下图。 客户端 A 将 “信件” 投入到客户端 B 的 “信箱” 中,然后客户端 B 去自己的 …

计算机图形学 实验二 三维模型读取与控制

目录 一、实验内容 二、具体内容 (在实验2.3的基础上进行修改) 1、OFF格式三维模型文件的读取 2、三维模型的旋转动画 3、键盘鼠标的交互 4、模型的修改 三、代码 一、实验内容 读取实验提供的off格式三维模型,并对其赋色。利用鼠标和键盘的交互&#xff0…

利用AI制作《职业生涯规划PPT》,10分钟完成

职业生涯规划是大学生活中非常重要的一环。通过制定职业规划,你能够明确未来的职业目标、认清自身的优劣势,进而制定切实可行的计划,以便顺利踏上职业发展的道路。而制作一份精美的职业生涯规划PPT,能有效帮助你在面试、职业规划报…

CKA认证 | Day2 K8s内部监控与日志

第三章 Kubernetes监控与日志 1、查看集群资源状态 在 Kubernetes 集群中,查看集群资源状态和组件状态是非常重要的操作。以下是一些常用的命令和解释,帮助你更好地管理和监控 Kubernetes 集群。 1.1 查看master组件状态 Kubernetes 的 Master 组件包…

EasyExcel级联下拉

代码 package com.xc.excel.select;import com.alibaba.excel.EasyExcel; import org.apache.poi.ss.usermodel.*; import org.apache.poi.ss.util.CellRangeAddressList; import org.apache.poi.xssf.usermodel.XSSFWorkbook;import java.io.FileOutputStream; import java.i…

快速入门CSS

欢迎关注个人主页:逸狼 创造不易,可以点点赞吗 如有错误,欢迎指出~ 目录 CSS css的三种引入方式 css书写规范 选择器分类 标签选择器 class选择器 id选择器 复合选择器 通配符选择器 color颜色设置 border边框设置 width/heigth 内/外边距 C…

界面控件DevExpress WPF中文教程:Data Grid——卡片视图设置

DevExpress WPF拥有120个控件和库,将帮助您交付满足甚至超出企业需求的高性能业务应用程序。通过DevExpress WPF能创建有着强大互动功能的XAML基础应用程序,这些应用程序专注于当代客户的需求和构建未来新一代支持触摸的解决方案。 无论是Office办公软件…

RWKV-5/6 论文被 COLM 2024 收录

由 Bo PENG 和 RWKV 开源社区共同完成的 RWKV-5/6架构论文《Eagle and Finch: RWKV with Matrix-Valued States and Dynamic Recurrence》被顶级会议 COLM 2024 收录。 这是继 RWKV-4 架构论文《RWKV: Reinventing RNNs for the Transformer Era》被 EMNLP 2023 收录之后&…

Spring底层源码(三)

invokeBeanFactoryPostProcessors(beanFactory) 这个方法里面会进行配置类的扫描.具体源码如下. 进入到 invokeBeanFactoryPostProcessors方法中,直接找invokeBeanDefinitionRegistryPostProcessors(currentRegistryProcessors, registry)这个方法进去,然后找实现类Configura…

vue3+vite 前端打包不缓存配置

最近遇到前端部署后浏览器得清缓存才能出现最新页面效果得问题 所以…按以下方式配置完打包就没啥问题了,原理很简单就是加个时间戳 /* eslint-disable no-undef */ import {defineConfig, loadEnv} from vite import path from path import createVitePlugins from…

【人工智能】10分钟解读-深入浅出大语言模型(LLM)——从ChatGPT到未来AI的演进

文章目录 一、前言二、GPT模型的发展历程2.1 自然语言处理的局限2.2 机器学习的崛起2.3 深度学习的兴起2.3.1 神经网络的训练2.3.2 神经网络面临的挑战 2.4 Transformer的革命性突破2.4.1 Transformer的核心组成2.4.2 Transformer的优势 2.5 GPT模型的诞生与发展2.5.1 GPT的核心…

FFmpeg存放压缩后的音视频数据的结构体:AVPacket简介,结构体,函数

如下图的解码流程,AVPacket中的位置 FFmpeg源码中通过AVPacket存储压缩后的音视频数据。它通常由解复用器(demuxers)输出,然后作为输入传递给解码器。 或者从编码器作为输出接收,然后传递给多路复用器(mux…

Jmeter系统入门教程(安装、组件使用、Demo展示、连接数据库、压测报告)

​压测工具实际项目中接触过ab,ab算一个常用而又直接的工具,jmeter以前自己测试过,但如此系统,细致的测试还是第一次,这个博主很多文章都很细致,问题解答及时一jmeter简介jmeter 是一款专门用于功能测试和压…

D3入门:概念、主要特点、基本功能、常见应用场景

D3.js(Data-Driven Documents)是一个JavaScript库,用于基于数据操作文档。它利用了HTML、SVG和CSS等Web标准技术,使得开发者可以创建丰富的交互式图表和数据可视化。D3.js的强大之处在于其灵活的数据绑定机制和对DOM元素的高效操作…