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.mfbz.cn/a/772141.html

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

相关文章

【第17章】MyBatis-Plus自动维护DDL

文章目录 前言一、功能概述二、注意事项三、代码示例四、实战1. 准备2. ddl配置类3. 程序启动4. 效果(数据库) 总结 前言 在MyBatis-Plus的3.5.3版本中&#xff0c;引入了一项强大的功能&#xff1a;数据库DDL&#xff08;数据定义语言&#xff09;表结构的自动维护。这一功能…

【电路笔记】-B类放大器

B类放大器 文章目录 B类放大器1、概述2、B类放大器介绍3、推挽式配置4、限制交叉失真5、B类放大器效率6、总结1、概述 我们在之前的文章中已经知道,A 类放大器的特点是导通角为 360,理论最大效率为 50%。 在本文中,我们将详细介绍另一类放大器,称为B类放大器,它是为解决A…

康姿百德磁性床垫好不好,效果怎么样靠谱吗

康姿百德典雅款床垫&#xff0c;打造舒适睡眠新体验 康姿百德床垫是打造舒适睡眠新体验的首选&#xff0c;其设计能够保护脊椎健康&#xff0c;舒展脊椎&#xff0c;让您享受一夜好眠。康姿百德床垫的面料选择也非常重要&#xff0c;其细腻亲肤的针织面料给您带来柔软舒适的触…

A*——AcWing 179. 八数码

A* 定义 A* 算法是一种在图形或地图中寻找最短路径的启发式搜索算法。它通过综合考虑起始节点到当前节点的实际代价和当前节点到目标节点的预估代价&#xff0c;来决定下一步的搜索方向。 运用情况 路径规划&#xff1a;如在地图导航中为车辆、行人规划最优路线。游戏开发&…

旅游系统(附管理端+前台)PHP源码

一. 前言 今天小编给大家带来了一款可学习&#xff0c;可商用的&#xff0c;旅游系统 源码&#xff0c;支持二开&#xff0c;无加密。支持景点管理&#xff0c;登录&#xff0c;景点预定&#xff0c;意见反馈&#xff0c;统计等功能。详细界面和功能见下面视频演示。 二. 视频…

深入挖掘海外快手kwai ads推广巴西slots手游广告独家优势

深入挖掘海外快手kwai ads推广巴西slots手游广告独家优势 在数字化时代&#xff0c;广告投放已成为各行各业不可或缺的一部分&#xff0c;特别是在游戏行业&#xff0c;如何有效地推广游戏产品&#xff0c;吸引玩家的眼球&#xff0c;成为了每一个游戏开发商和广告主所关注的焦…

DllImport进阶:参数配置与高级主题探究

深入讨论DllImport属性的作用和配置方法 在基础篇中&#xff0c;我们已经简单介绍了DllImport的一些属性。现在我们将深入探讨这些属性的实际应用。 1. EntryPoint EntryPoint属性用于指定要调用的非托管函数的名称。如果托管代码中的函数名与非托管代码中的函数名不同&#…

TreeSize Free - 硬盘空间管理工具

TreeSize FreeTreeSize Free 是一款免费的强大灵活的硬盘空间管理工具。可以帮你找出硬盘上最大的目录以及它占用的空间。支持空间大小显示、分配空间和占用空间、文件数、3D工具条和分配图、最近使用数据、文件作者、NTFS压缩率等信息&#xff0c;并支持搜索文件。该软件类似浏…

掌握亚马逊自养号:测评策略的核心要点与实战经验

在当今电商领域的激烈角逐中&#xff0c;亚马逊测评对于卖家而言&#xff0c;已从单纯的销量助推器与好评累积工具&#xff0c;进化为品牌塑造与市场洞察的关键环节。然而&#xff0c;许多卖家仍局限于传统认知&#xff0c;未能充分挖掘自养号测评的多元化价值与深远影响。本文…

Modbus协议转Profinet协议网关模块连智能仪表与PLC通讯

一、现场需求&#xff1a;PLC作为控制器&#xff0c;仪表设备做为执行设备&#xff0c;执行设备能够实时响应PLC传来的指令&#xff0c;并且向PLC回馈数据&#xff0c;从而达到PLC对仪表设备进行控制和监测&#xff0c;实现对生产过程的精准控制。 二、解决方案&#xff1a;通过…

2024年7月5日 十二生肖 今日运势

小运播报&#xff1a;2024年7月5日&#xff0c;星期五&#xff0c;农历五月三十 &#xff08;甲辰年庚午月庚午日&#xff09;&#xff0c;法定工作日。 红榜生肖&#xff1a;狗、羊、虎 需要注意&#xff1a;鸡、牛、鼠 喜神方位&#xff1a;西北方 财神方位&#xff1a;正…

java考试题20道

选择题 编译Java源代码文件的命令是javac javac命令是将Java源代码文件进行编译得到字节码文件(.class文件) java命令是在JVM上运行得到的字节码文件 下面是一个示例&#xff1a; javac test.java -------> test.class java test ------> 运行test.class文件下列那…

QT_GUI

1、QT安装 一个跨平台的应用程序和用户界面框架&#xff0c;用于开发图形用户界面&#xff08;GUI&#xff09;应用程序以及命令行工具。QT有商业版额免费开源版&#xff0c;一般使用免费开源版即可&#xff0c;下面安装的是QT5&#xff0c;因为出来较早&#xff0c;使用较多&…

以品质为初心,以创新为驱动,光明乳业闪耀第十五届中国奶业大会

2024年7月3日&#xff0c;以“数智赋能引领产业发展增长点&#xff0c;科技创新驱动奶业新质生产力”为主题的中国奶业协会第十五届奶业大会奶业20强&#xff08;D20&#xff09;论坛暨2024中国奶业展览会隆重召开&#xff0c;光明乳业党委书记、董事长黄黎明受邀出席会议&…

代谢组数据分析(十三):评估影响代谢物的重要临床指标

欢迎大家关注全网生信学习者系列: WX公zhong号:生信学习者Xiao hong书:生信学习者知hu:生信学习者CDSN:生信学习者2介绍 相关性分析是通过计算两个变量之间的相关系数来评估它们之间线性关系的强度和方向。最常用的是皮尔逊相关系数(Pearson correlation coefficient),…

python库(3):Cerberus库

1 Cerberus简介 Cerberus 是一个Python数据验证库&#xff0c;设计用于验证数据结构的有效性和一致性。它提供了一种简单而强大的方式来定义和应用验证规则&#xff0c;特别适用于处理用户输入的验证、配置文件的检查以及API的参数验证等场景。下面将详细介绍 Cerberus 的特点…

vite项目配置svg图标(vite-plugin-svg-icons)

1.插件地址 网址 , 可以去里面查看中文文档,里面有详情的教程 2.使用, 如果你安装的有element-plus ,可以使用这样的方式来修改大小和颜色 <el-icon size"18" color"red"><SvgIcon name"xing"></SvgIcon></el-icon> …

汇聚荣拼多多评价好不好?

汇聚荣拼多多评价好不好?在探讨电商平台的口碑时&#xff0c;用户评价是衡量其服务质量和商品质量的重要指标。拼多多作为国内领先的电商平台之一&#xff0c;其用户评价自然成为消费者选择购物平台时的参考依据。针对“汇聚荣拼多多评价好不好?”这一问题&#xff0c;可以从…

Elasticsearch初识与 index+mapping+document 基操

前言 在21年多少有使用过es 当时是在艺术赛道的一个教育公司&#xff0c;大概流程就是 将mysql中的各种课程数据通过logstash汇总到es 然后提供rest接口出去。由于在职时间较短(很不幸赶上了教育双减)&#xff0c;所以对es的了解其实仅仅是些皮毛&#xff0c;当然elk在我的任职…

稀疏数组搜索

题目链接 稀疏数组搜索 题目描述 注意点 字符串数组中散布着一些空字符串words的长度在[1, 1000000]之间字符串数组是排好序的数组中的字符串不重复 解答思路 因为数组中的字符串是排好序的&#xff0c;所以首先想到的是二分查找&#xff0c;先将数组中长度与s相同的字符串…