先认识浏览器和 dom

news2024/12/23 22:33:23

先认识浏览器和 dom

  • 认识浏览器
    • 使用控制台(console)
    • 初识 dom
    • 获取浏览器可见区域高度
    • 简单的操作一下 dom
    • 向页面添加一个元素
    • innerHTML
    • 认识块模式
    • 认识坐标与定位
  • 小结

认识浏览器

我们先创建一个文本文件,然后将其扩展名改成 html,或者直接创建一个 html 文档。嗯,空白的,里面一个字符都不要有哦。
在这里插入图片描述
然后,我们把这个文件拖到浏览器里。我们先简单认识一下基本的 dom。

在这里插入图片描述

使用控制台(console)

拖进浏览器后,我们按一下 F12 键,就可以打开控制台了,也许会是别的标签&#x

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

『pyqt5 从0基础开始项目实战』08. 本地数据配置文件的保存与读取之SMTP邮件报警(保姆级图文)

目录导包和框架代码简化说明绑定鼠标事件编写弹窗UI和读取配置保存配置功能读取本地配置文件编写UI界面保存设置main.py中启动弹窗UI完整代码main.pythreads.pydialog.py总结欢迎关注 『pyqt5 从0基础开始项目实战』 专栏,持续更新中 欢迎关注 『pyqt5 从0基础开始项…

什么是MVVM?

MVVM 是 Model-View-ViewModel 的缩写,是M-V-VM三部分组成。它本质上就是MVC的改进版。 M:Model 代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑。 V:View 代表视图UI,它负责将数据模型转化成UI 展现出来。…

OpenResty+OpenWAF的WEB防护实战

OpenResty是一个基于 Nginx 与 Lua 的高性能 Web 平台,其内部集成了大量精良的 Lua 库、第三方模块以及大多数的依赖项。用于方便地搭建能够处理超高并发、扩展性极高的动态 Web 应用、Web 服务和动态网关。本文介绍通过OpenRestyOpenWAF来搭建软WAF的应用&#xff…

【Linux】多线程协同

目录 生产消费模型 BlockQueue阻塞队列模型 BlockQueue.hp Task.hpp mypc.cc RingQueue循环队列模型 POSIX信号量 RingQueue.hpp Task.hpp main.cc 生产消费模型 生产者与生产者之间关系:互斥(竞争) 消费者与消费者之间关系&…

偏向锁到轻量级锁的升级过程(耗资源)

目录 上原理: 细说原理: 什么是锁记录呢? 什么是Mark Word 呢? 上图解: 上原理: 偏向锁使⽤了⼀种等到竞争出现才释放锁的机制,所以当其他线程尝试竞争偏向锁时, 持有偏向锁的…

nssctf web 入门(3)

目录 [NISACTF 2022]easyssrf [SWPUCTF 2021 新生赛]ez_unserialize [SWPUCTF 2021 新生赛]no_wakeup 这里通过nssctf的题单web安全入门来写,会按照题单详细解释每题。题单在NSSCTF中。 想入门ctfweb的可以看这个系列,之后会一直出这个题单的解析&…

FLStudio21中文版本好不好用?值不值得下载

FLStudio中文21最新版本以其使用速度而闻名,是一个高度复杂的音乐制作环境。现代的DAW是一种非凡的野兽。首先,它在很大程度上把自己放在了(几乎)每个人记录过程的核心。其次,通过在价格适中的软件中模拟完整的工作室体验,它在音乐…

国内版的ChatGPT弯道超车的机会在哪里?

前言 从去年11月最后一天ChatGPT诞生,截至目前,ChatGPT的热度可谓是爆了。众所周知,ChatGPT是美国“开放人工智能研究中心”研发的聊天机器人程序,它是一个人工智能技术驱动的自然语言处理工具,它能够通过学习和理解人…

【数据分析】— 特征工程、特征设计、特征选择、特征评价、特征学习

【数据分析】— 特征工程特征工程是什么? (Feature Engineering)特征工程的意义特征工程的流程特征的设计从原始数据中如何设计特征?基本特征的提取创建新的特征函数变换特征独热特征表示 One-hot Representation数据的统计特征TF-IDF(词频-逆…

「Cpolar」看我如何实现公网远程控制Mac OS【使用mac自带VNC】

💂作者简介: THUNDER王,一名热爱财税和SAP ABAP编程以及热爱分享的博主。目前于江西师范大学本科在读,同时任汉硕云(广东)科技有限公司ABAP开发顾问。在学习工作中,我通常使用偏后端的开发语言A…

探寻人工智能前沿 迎接AIGC时代——CSIG企业行(附一些好玩的创新点)

上周我有幸参加了由中国图像图形学会和合合信息共同举办的CSIG企业行活动。这次活动邀请了多位来自图像描述与视觉问答、图文公式识别、自然语言处理、生成式视觉等领域的学者,他们分享了各自的研究成果和经验,并与现场观众进行了深入的交流和探讨。干货…

重感知还是重地图?其实无需选择

近来,关于自动驾驶应该重感知还是重地图是个热点话题,很多重量级车厂、自动驾驶供应商都开始提出重感知轻地图的方案,并承诺很快能发布出对应的产品。业界也出现了高精地图已“死”等类似的言论。 一时之间,似乎轻地图已经成为了…

三种实现模型可视化的方式(print, torchinfo, tensorboard)

记录一下自己使用的三种模型可视化的方式,从简单到难 Print 最简单的是print,就不用多说了。 Torchinfo from torchinfo import summary import torch model (...) summary(model, (1,3,128,128))即可按照像文档路径一样的方式输出结构,…

算法模板(2):数据结构(5)做题积累

数据结构(3) 一、并查集 238. 银河英雄传说 有 NNN 艘战舰,也依次编号为 1,2,...,N1,2,...,N1,2,...,N,其中第 iii 号战舰处于第 iii 列。有 TTT 条指令,每条指令格式为以下两种之一:M i j,表…

Linux lvm管理讲解及命令

♥️作者:小刘在C站 ♥️个人主页:小刘主页 ♥️每天分享云计算网络运维课堂笔记,努力不一定有收获,但一定会有收获加油!一起努力,共赴美好人生! ♥️夕阳下,是最美的绽放,树高千尺,落叶归根人生不易,人间真情 前言 目录 一、lvm管理 1.Logical Volume Manager,逻…

【运维笔记】VM centos 环境安装

镜像选择 阿里镜像源 注意在安装时,安装非图形化界面选择minimal版本安装。(笔者在安装时选择了erverything和DVD,发现都是图形界面hhh,浪费了一早上时间) 翻阅百度垃圾堆,版本号都推荐7.6-7.9&#xff…

图解国家网信办《生成式人工智能服务管理办法(征)》| 附下载

伴随ChatGPT兴起,生成式人工智能技术正作为一种创造性应用,牵引场景创新,推动新技术迭代升级和产业快速增长。由于生成式人工智能处于发展初期,技术成熟度、政策合规性等发展不足,导致其极易面临非法获取数据、个人隐私…

基于差分进化算法的含DG配电网无功优化模型

目录 1 主要内容 目标函数 算法流程 2 部分程序 3 程序结果 4 程序链接 1 主要内容 该程序参考《自适应多目标差分进化算法在计及电压稳定性的无功优化中的应用》,以网损和电压偏差为目标,考虑DG无功出力和电容器组,建立多目标无功优化…

OpenAI-ChatGPT最新官方接口《文本交互》全网最详细中英文实用指南和教程,助你零基础快速轻松掌握全新技术(一)(附源码)

Text completion 文本交互前言Introduction 导言Prompt design 提示设计Basics基础知识TroubleshootingClassificationImproving the classifiers efficiency 提高分类器的效率Generation 总结Conversation 对话Transformation 变化Translation 翻译Conversion 转化Summarizati…

联想服务器配置RAID

一、背景描述 目前有台联想服务器,配置如下: CPU:2颗处理器,40核 内存:512GB 磁盘:2*960GB SATA 4*2.4TB SAS 计划在联想物理机上安装 Vmware 的 ESXi 6.7 虚拟化管理软件,作为虚拟化服务器。…