web零碎知识

&nbsp 在html文件中 连续的空格会被认为是一个空格 所以我们需要使用&nbsp来代表空格

&#x3000 把这个当成tab键来使用

我们可以引入js文件,就可以减少html文件的长度。
 

首先创建一个js文件夹,然后在js文件夹中创建一个,后缀名是.js的文件,然后将js代码放在这个文件中,注意将js文件放在文件中的时候需要将script的标签去掉 不然会报错。

然后引入js文件的时候最好放在body的后面

js的输出语句

这样就拿不到x的值了,应为let是在作用域中起作用(代码块) 

这个删除元素的意思是:从第二个元素开始,删除两个元素

json对象是这样创建的

函数还可以这样创建

这个应该是一个类,注意由于json在传送的时候相当于一个字符串. 所以在给其变量命名的时候也需要是一个一字符串。

这两个方法很重要,有关前后端的交互的,parse方法:将一个json字符串转化为一个对象(这样做的目的是:当后端传过来一个json字符串的时候,可以将这个字符串转化为一个对象,这样就可以调用里卖弄的方法和成员变量)。

对于bom对象,我们其实常用的就只有两个对象一个是window对象,然后就是location对象

这几个对象的具体用法

location的主要使用方法

DOM 是 "Document Object Model" 的缩写,中文翻译为“文档对象模型”。它是一种用于表示和操作网页内容(即HTML和XML文档)的平台和语言中立的接口。通过DOM,程序可以动态地访问和修改文档的结构、样式和内容。

  1. 树状结构:DOM 将网页表示为一个由节点组成的树状结构,每个节点代表文档中的一个元素或文本。这种结构使得可以通过编程方式访问和操作文档的任何部分。

  2. 跨平台:DOM 提供了一个跨平台的接口,使得开发者可以在不同的浏览器和环境中使用相同的代码来操作网页。

  3. 动态更新:DOM 允许动态地更新网页内容。通过JavaScript等脚本语言,开发者可以在用户与网页交互时实时地修改文档的内容、结构和样式。

  4. 事件处理:DOM 支持事件处理,这意味着可以为文档中的元素添加事件监听器,以便在用户执行某些操作(如点击、滚动等)时执行特定的代码。

修改html文档元素的操作

总结起来就两步 第一获取道元素对象,第二调用元素对象中可以进行改变的内容的方法,像idv这个的方法就是innerHTML,而img标签的方法就是直接调用src,然后改变这个src的值即可

事件绑定(建议以下面这种形式进行,如果在html元素中写函数,耦合性太高了)

常见的事件

我觉得这个可以做搜索,或者是登录注册界面

弹性布局

布局原理:注意是给父元素添加flex布局属性

常见的父属性

当我们给父级元素添加属性flex属性要在display这里面进行添加

怎么设置这个轴:先写flex-direction:row(这个是以x轴从左到右进行排列)或者是flex-direction:colum(这个是以y轴从上到下进行排列的)

这个align-items设置的是侧轴上的样式:如果x轴式主轴,那么y就是侧轴。如果y是主轴,那么x就是侧轴。

这个单独使一个盒子向下移动

* {margin: 0;padding: 0;box-sizing: border-box;
}

这段CSS代码将对页面上的所有元素执行以下操作:

  • 将所有元素的外边距(margin)设置为0。
  • 将所有元素的内边距(padding)设置为0。
  • 将所有元素的盒模型设置为 border-box,这意味着元素的宽度和高度将包括内边距和边框。

使用通配选择器可以很方便地重置浏览器的默认样式,因为不同的浏览器可能会为元素提供不同的默认样式。通过使用 *{} 规则,你可以确保所有元素从相同的样式基线开始,从而提高页面的一致性和可预测性。

display:block; 让其以模块的形式进行展示

 

display: block; 是一个属性值,用于定义元素的显示类型。将元素的 display 属性设置为 block 会使该元素以块级元素(block-level element)的方式显示。块级元素具有以下特点:

  1. 开始新行:块级元素总是在新的一行开始,并且其后的元素也会在新的一行显示。

  2. 宽度默认:块级元素的宽度默认是其父元素宽度的100%(除非指定了宽度)。

  3. 可以设置宽度和高度:与内联元素不同,块级元素可以设置宽度(width)和高度(height)。

  4. 可以包含其他块级元素和内联元素:块级元素可以包含其他块级元素、内联元素或两者的组合。

  5. 外边距和内边距:块级元素可以有外边距(margin)和内边距(padding),这些属性不会对周围的元素产生影响。

常见的块级元素包括:<div><p><h1><h6><section><article><aside><header><footer><nav> 等。

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

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

相关文章

数据库表导出到excel:前置知识4 业务和效果

清单配置页面(就是配置那些用户可以下载那些表内容,清单下载实际就是指数据库表下载,清单就是对应的表) 比如:导出一个atom_base_info表数据(数据多) atom_base_info的数据结构 下面这个配置审核状态一类不问&#xff0c;直接到清单下载页面 发起自己想下载的清单(先异步把数…

FreeRTOS之队列上锁和解锁(详解)

这篇文章将记录我学习实时操作系统FreeRTOS的队列上锁和解锁的知识&#xff0c;在此分享给大家&#xff0c;希望我的分享能给你带来不一样的收获&#xff01; 目录 一、简介 二、队列上锁函数prvLockQueue&#xff08;&#xff09; 1、函数初探 2、应用示例 三、队列解锁函…

第8天:模块和包

学习目标 理解Python模块和包的概念学习如何创建和导入模块掌握标准库模块的使用学习如何使用包组织代码 学习内容 1. 模块的概念 模块是一个包含Python代码的文件&#xff0c;模块可以包含函数、类和变量&#xff0c;也可以包含可执行的代码。模块使你能够组织和重用代码。…

如何对关键字段进行脱敏(二)如何在某些查询中取消脱敏?

要在使用Mybatis-plus进行数据库查询时准确区分哪些查询需要脱敏,哪些不需要,同时保留获取精确手机号码的能力,可以采用以下方案: 自定义注解标记 创建一个自定义注解,用于标记不需要脱敏的查询方法: Retention(RetentionPolicy.RUNTIME) Target(ElementType.METHOD) public…

TCP/IP模型每层内容和传输单位

TCP/IP&#xff08;Transmission Control Protocol/Internet Protocol&#xff09;模型是一种用于描述网络通信中协议层次结构的模型&#xff0c;它最初被设计用来描述互联网的协议栈。TCP/IP模型通常分为四层&#xff0c;自下而上分别为&#xff1a; 网络接入层&#xff08;Ne…

js之模糊搜索

多的不说 少的不唠 直接上代码

使用el-form自定义校验的同时使用v-if/v-show引起的校验问题

有时候需要根据不同的条件来回显具体的内容&#xff0c;这时候就会用到v-if/v-show&#xff0c;此时表单的校验就可能会出现一些问题。 比如&#xff1a;使用v-if的时候&#xff0c;明明切换到了另一个条件&#xff0c;但是对应元素的表单校验却没有生效&#xff1b;使用v-show…

警翼警用记录仪视频格式化后恢复方法

警翼是国内较大的一家警用记录仪厂商&#xff0c;此品牌我们恢复过很多&#xff0c;此次遇到的是一个典型的误格式化的情况&#xff0c;我们来看看误格式化后如何恢复。 故障存储: 32G卡/fat32 故障现象: 客户提供的信息是在交接设备后没有及时备份而做出了初始化设备的操…

养老院管理系统-计算机毕业设计源码00010

养老院管理系统的设计与实现 摘要 本文介绍了一种基于Spring Boot框架的养老院管理系统的设计与实现。该系统旨在帮助养老院管理者更有效地管理机构内的各项事务&#xff0c;并提供更好的服务于老年人。系统的设计考虑了养老院管理的特殊需求&#xff0c;包括系统用户、老人信息…

高二的他已通过NOI保送北大了,让我们一起了解他的信息学奥赛学习经历吧!!!

相信关注本号的各位&#xff0c;对于信息学奥赛已经不陌生了&#xff0c;部分同学也已经开始踏入信息学的旅程&#xff0c;但前路茫茫&#xff0c;让我们一起看看已经取得成就的同学的经历吧。 今天要介绍的这位同学&#xff0c;是来自深圳中学的高二某班的欧阳达晟同学&#x…

简洁纯文字类的Typecho主题wenso

主题介绍 文章说说类博客网站源码&#xff0c;页面清新简洁。适合文章说说美文博客网站建站使用&#xff0c;响应式手机版本。 本来是dedecms的模板&#xff0c;也比较简单&#xff0c;适合用来搭建一个文学类的&#xff0c;纯文字的网站&#xff0c;简单的改成了typecho&…

AI写作开启新篇章

AI写作开启新篇章 随着人工智能技术的飞速发展&#xff0c;AI写作逐渐成为一种新的趋势和工具。它不仅为个人写作提供了便利&#xff0c;也在企业内容生产、学术研究、创意写作等领域展现了广泛的应用前景。AI写作的核心在于利用自然语言处理&#xff08;NLP&#xff09;技术&…

3086. 拾起 K 个 1 需要的最少行动次数 Hard

给你一个下标从 0 开始的二进制数组 nums&#xff0c;其长度为 n &#xff1b;另给你一个 正整数 k 以及一个 非负整数 maxChanges 。 Alice 在玩一个游戏&#xff0c;游戏的目标是让 Alice 使用 最少 数量的 行动 次数从 nums 中拾起 k 个 1 。游戏开始时&#xff0c;Alice 可…

JVM 堆内存结构 年轻代 老年代

堆内存 内存划分 对于大多数应用&#xff0c;Java 堆是 Java 虚拟机管理的内存中最大的一块&#xff0c;被所有线程共享。此内存区域的唯一目的就是存放对象实例&#xff0c;几乎所有的对象实例以及数据都在这里分配内存。 为了进行高效的垃圾回收&#xff0c;虚拟机把堆内存…

线程池的七大核心参数

今天了解到线程池的七大核心参数包括&#xff1a; 1. 核心线程数&#xff08;corePoolSize&#xff09;&#xff1a;线程池中能够同时执行的线程数量。 2. 最大线程数&#xff08;maximumPoolSize&#xff09;&#xff1a;线程池中允许的最大线程数量。 3. 线程空闲时间&#…

小白 | 华为云docker设置镜像加速器

一、操作场景 通过docker pull命令下载镜像中心的公有镜像时&#xff0c;往往会因为网络原因而需要很长时间&#xff0c;甚至可能因超时而下载失败。为此&#xff0c;容器镜像服务提供了镜像下载加速功能&#xff0c;帮助您获得更快的下载体验。 二、约束与限制 构建镜像的客…

6年铲屎官测评宠物空气净化器哪款好,热门养宠空气净化器排名

作为一名资深猫奴&#xff0c;发现很多铲屎官每到春秋换季就开始疯狂打喷嚏、突然开始全身过敏。其原因是猫毛一到换季就开始疯狂掉毛&#xff0c;相对于可见猫毛&#xff0c;漂浮在空气中的浮毛就是罪灰祸首。微小的浮毛在空气总容易被人体吸入体内&#xff0c;而浮毛上面附带…

【Python机器学习】模型评估与改进——在模型选择中使用评估指标

我们通常希望&#xff0c;在使用GridSearchCV或cross_val_score进行模型选择时能够使用AUC等指标。scikit-learn提供了一种非常简单的实现方法&#xff0c;那就是scoring参数&#xff0c;它可以同时用于GridSearchCV和cross_val_score。你只需要提供一个字符串&#xff0c;用于…

Appium自动化测试框架3

滑动与拖拽 swipe 滑动时间的长短会影响最后的结果的 是有一定误差的 from appium import webdriver import time # 启动一个字典 包装相应的启动参数 desired_caps dict() # 平台的名字&#xff0c;安卓还是IOS 大小写无所谓 desired_caps[platformName] Android # 平台的…