html css javascript jquery
关注
分享
扫一扫
文章平均质量分 70
html......
富士康质检员张全蛋
人生实难，唯有自渡。只有接受了真实现的现状和真实的自己，调整好心态，才能脚踏实地的活着，然后去发现角落处的那些惊喜和美好，去相信一切苦难困境都会过去！“即使身处阴沟，也要记得仰望星空”。
展开
-
JavaScript getElementById 使用方法
在JavaScript中，document.getElementById()是一种用于通过元素的id属性获取DOM元素的方法。它的作用是返回与指定id匹配的HTML元素。使用document.getElementById()可以通过元素的id属性直接获取该元素的引用，在标签上定义一个ID，然后JS基于这个ID去调用它。然后可以使用该引用对元素进行各种操作。(1) 修改元素的内容或属性。(3)获取表单元素的值。(2)添加事件监听器。原创 2024-08-14 16:53:41 · 5760 阅读 · 0 评论 -
JavaScript 数据类型 对象概述
对象(object)是JavaScript语言的核心概念，也是最重要的数据类型简单说，对象就是一组“键值对”(key-value)的集合，是一种无序的复合数据集合。最外层的user说明创建了这样一个对象，然后这个对象里面有name的key对应值，还有一个age对应的值。name和其值就组成了键值对，同样age也是一样。用代码的方式来表现就是这样：name和age称之为属性，还可以有更加复杂的类型，数组类型等等，还也可以有函数类型。对于对象体内的数据是没有类型限制的，你可以放置很多种。原创 2024-04-21 12:16:06 · 453 阅读 · 1 评论 -
CSS3 新特性 box-shadow 阴影效果、圆角border-radius
margin: 0 auto：上下不需要管，auto是让左右的空间平均分配，然后让盒子在中间，这就是居中。如果想要图形变为圆角效果，只需要添加一个属性就行了，border-radius 这个属性。（1）四个值：第一个值为左上角，第二个值为右上角，第三个值为右下角，第四个值为左下角。0代表水平方向没有阴影，第二个0代表垂直方向没有阴影，第三个是阴影的模糊度。（2）三个值：第一个值为左上角，第二个值为右上角和左下角，第三个值为右下角。（3）两个值：第一个值为左上角与右下角，第二个值为右上角与左下角。原创 2024-04-17 21:07:38 · 1049 阅读 · 0 评论 -
CSS 清除浮动
浮动也会产生一些问题，所以在使用的时候还需要清除浮动，这样操作起来还是很麻烦的，在没有浮动的时候就不要乱使用，因为还需要清除掉，这样的操作还是很繁琐的。如果子元素受到影响分为里面和外面，如果是里面增加clean属性，如果在外面，那么之前的高度清除浮动，overflow和虚对象都可以默认将其撑下来了。在日后的布局当中是否都使用清除浮动的方式去布局，这样就不会有标准流的问题，只有在有需要的时候才使用浮动去解决。就和吃药的道理是一样的，如果没有生病就不需要吃药，因为药也是有副作用的，浮动也是如此。原创 2024-04-02 07:49:53 · 1468 阅读 · 0 评论 -
CSS 绝对定位 position:absolute、z-index 设置堆叠顺序
绝对定位absolute定位是CSS中的一种定位方式，可以将元素精确定位到一个确定的点，这与元素在文档流上的自然位置无关。相比起其他定位方式，绝对定位很灵活性，它可以将元素脱离文档流，使得元素的位置不受页面上其他元素的影响。相应地，元素独立悬浮于页面上。原创 2024-03-18 17:20:19 · 3827 阅读 · 0 评论 -
CSS 脱离标准文档流 标签元素的浮动
由于存在两层，标准的那一层和浮动的那一层会出现压盖的现象。横向摆放，当元素不同的时候，元素宽度不够的情况下，在空间不够的情况下会将其挤到下面来。下面的盒子属于在标准流当中的盒子，而上面的盒子属于脱离标准流的盒子，它会在在下面的盒子上面再覆盖一层。无论向左还是向右浮动都是脱离文档流，它会在标准流的上面再来一层，而那一层来放置浮动的元素。此时可以理解为有两层页面，一层是底层的原页面，一层是脱离文档流的上层页面，所以会出现折叠现象。现在的页面有两层，一层在下面，一层在上面，这样就不会产生在标准流当中的一些问题。原创 2024-03-18 13:56:19 · 1986 阅读 · 0 评论 -
CSS 文档流
块元素：比如li标签或者h1这种，都是默认自上而下摆放的。内联标签：如果是span标签或者strong标签，它是从左到右进行摆放的。可以看到有文本的时候，高矮是不一样的，他们是以底边对其的。高矮不齐的时候是以底边进行对其的。上面都是默认元素会产生的问题。这个时候，就不能使用文档中元素默认的位置去摆放。空格问题，无论在文本位置放置了多少空格，默认出现在页面上面只有一个空格。是指页面上的元素在摆放的时候所占用的空间，也泛指页面元素放置的位置。这三种都会脱离文档流，一旦脱离文档流，元素的管理就会变的容易一些。原创 2024-03-11 16:15:57 · 1557 阅读 · 0 评论 -
CSS 弹性盒子模型 容器子元素排列 Flex container、Flex item
总结 在父亲元素属性比较多，开启弹性盒子模型通过display：flex属性来开启，子盒子方向可以通过flex-direction进行调整，之后就是子盒子上下左右位置，最后就是子盒子在父盒子当中的平均分配。现在可以为盒子的布局设置一个弹性盒子模型，给外层容器的div加上弹性盒子设置，那么就可以管理里面三个盒子。一个大的盒子里面里面的子元素如何摆放由我们的弹性盒子说的算。之前的盒子模型是一个元素，内边距外边距，边框来调整在页面所显示的位置。弹性盒子，在大容器里面，里面有很多的小盒子，这些小盒子是如何摆放的。原创 2024-03-09 12:38:52 · 2163 阅读 · 0 评论 -
CSS 盒子模型（box model）
盒子虽然变大了但是内容在往中间挤，中间的内容还是在盒子的左上角，剩下的是内边距帮你填充的。如果把盒子模型看作是一个生活中的快递，那么内容部分等同于你买的实物，内边距等同于快递盒子中的泡沫，边框等同于快递盒子，外边距等同于两个快递盒子之间的距离。上下是一个值，左右是一个值。，它包括：外边距(margin)，边框(border)，内边距(padding)，和实际内容(content)。蓝色的是一个盒子，这是一个元素，这个元素包含内边距padding，边框和外边距。内容文字图片是实物，然后内边距，边框，外边距。原创 2024-03-01 11:37:06 · 2932 阅读 · 0 评论 -
CSS技巧：实现两个div在同一行显示的方法
要将两个div放置在同一行上，可以将它们放置在一个具有Flexbox属性的父容器中，并设置其display属性为flex。在实际开发中，还可以使用CSS框架如Bootstrap等提供的栅格系统来实现响应式布局，以适应不同屏幕尺寸的显示。要将两个div放置在同一行上，可以给它们设置相同的浮动方向，例如都设置为左浮动(float: left)。要将两个div放置在同一行上，可以将它们的display属性设置为inline-block，并设置宽度、高度、边距等属性来调整它们的布局。原创 2024-02-29 16:47:09 · 9258 阅读 · 0 评论 -
JavaScript 数组方法 push()/pop() shift()/unshift
在while循环里面，取到的值为数字，对数字取布尔值肯定是true。对0和undefined、null取值是false。pop是从尾部操作，而shift是从头部操作，操作完之后会返回删除元素的值。原创 2024-02-29 10:40:17 · 1792 阅读 · 0 评论 -
JavaScript 数组 length属性|遍历
多维数组：数组里面嵌套 一层数组为二维数组。一维数组的使用频率是最高的。如果数组访问越界会返回undefined。这个方法可以去判定一个内容是否是数组。原创 2024-02-23 11:04:35 · 2017 阅读 · 0 评论 -
JavaScript 循环语句之for、while循环 | break continue
for循环<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>首页</title></head><body> <script type="text/javascript"> var num = 100 for (let i = 0; i原创 2023-12-18 17:33:00 · 3782 阅读 · 0 评论 -
JavaScript 三元运算符 （条件真假）? 表达式1：表达式2
条件为真执行表达式1，条件为假执行表达式2，有点像if else语句，三目运算符的目的就是简化if else的编写形式。原创 2023-12-12 14:27:21 · 3741 阅读 · 0 评论 -
JavaScript 条件语句之switch
需要注意的是，每个case代码块内部的break语句不能少，否则会接下去执行下一个case代码块，而不是跳出switch结构。if..else虽然有多条路选择，但是代码读起来会很累人，说白了就是使用switch来简化if else表达式。语法会有switch关键字，case关键字，以及break关键字。break其实就是跳出判断，不继续往下执行了。原创 2023-12-09 10:03:30 · 3156 阅读 · 0 评论 -
JavaScript if...else语句
if结构先判断一个表达式的布尔值，然后根据布尔值的真伪，执行不同的语句。所谓布尔值，指的是JavaScript的两个特殊值，true表示真，false表示伪。（）里面不一定是true和false，还可能是表达式生成的。x=y里面是会执行的，其实也就是if(2)，那么是为true的，条件语句会执行。原创 2023-12-08 10:20:37 · 3976 阅读 · 0 评论 -
JavaScript 运算符
null与undefined都可以表示“没有”，含义非常相似。将一个变量赋值为undefined或null，老实说，语法效果几乎没区别。既然含义与用法都差不多，为什么要同时设置两个这样的值，这不是无端增加复杂度，令初学者困扰吗?数组返回的也是object，如果使用typeoof来判断一个类型是否是对象类型的话，不准确，因为返回的对象的类型的情况有很多。JavaScript有三种方法，可以确定一个值到底是什么类型，而我们现在需要接触到的就是typeof。//null一般代表对象为 “没有”原创 2023-11-27 16:40:40 · 2863 阅读 · 0 评论 -
jQuery Ajax前后端数据交互
例如在不刷新页面的情况下查询数据、登录验证等（数据在没有变化的情况下走的是缓存）在往后端发送一个请求，在发送请求之后，正常拿到数据会渲染到用户列表的ul里面去。ajax是用来做前后端交互的，前端使用ajax去去发送一个请求，后端给其响应拿到数据，前端做些展示。在前端去对接开发的时候，它肯定要知道对接的后端接口返回的是什么数据，根据数据格式去做怎么样的数据处理。如果局部有新数据需要更新，需要刷新浏览器重新发起页面请求获取最新数据，如果。每次都是通过刷新解决这个问题，势必会给服务器造成负载加重，页面加载缓慢。原创 2023-11-15 15:09:21 · 3845 阅读 · 0 评论 -
CSS 关系选择器 派生选择器
选择所有被E元素包含的F元素，中间用空格隔开。原创 2023-11-15 15:08:34 · 2501 阅读 · 0 评论 -
JavaScript 标识符、变量声明
最常见的标识符就是变量名标识符是由：字母、美元符号($)、下划线(L)和数字组成，其中数字不能开头，温馨提示中文是合法的标识符，可以用作变量名(不推荐)变量是在程序当中开辟一块空间，然后为这个空间创建名称，这个空间就是用来存放数据的。JavaScript引擎的工作方式是，先解析代码，获取所有被声明的变量，然后再一行一行地运行。var是一个关键字，代表这个词汇就是这样写的，不可以被改变。var的作用是用来声明变量的。就是所有的变量的声明语句，都会被提升到代码的头部，这就叫做变量提升(hoisting)。原创 2023-11-15 14:28:46 · 2436 阅读 · 0 评论 -
JavaScript库：jQuery 选择器、操作HTML
js先要去获取dom元素，再去click，之后给其匿名函数。jquery就简单了，直接将$符号填进来，直接再去点click完事。下面其实就是先去获取text的内容，然后将内容放到这个demo选择器里面去。可能一两行就可以实现，因此得到前端程序猿广泛应用。设置或返回所选元素的文本内容 text标签是不会获取到html元素的。从被选元素中删除一个或多个类样式。向被选元素添加一个或多个类样式。除非特殊要求，一般用的少。设置或返回表单字段的值。删除类样式的切换操作。常用版本 2.x，设置或返回所选元素的。原创 2023-11-14 14:04:05 · 874 阅读 · 0 评论 -
JavaScript 基本数据类型 字符串
在JS中，数据类型有：字符串、数字、布尔、数组、对象、NullUndefined用到最多的还是字符串和数组的转换。是一个具有映射关系的数据结构。用于存储有一定关系的元素。d = {'key1':value1, 'key2':value2, 'key3':value3} 注意:对象通过key来访问value，因此字典中的key不允许重复。一个特定的符号，用它与其他数据 类型连接起来组成一个表达式。常用于条件 判断，根据表达式 返回True/False采取动作。原创 2023-11-08 16:07:03 · 782 阅读 · 0 评论 -
HTML 超链接标签、图片标签
超链接就是用来跳转到路径上面。herf是和a标签一起使用的，超链接一般都是使用a标签的，herf只是标签a里面的一个属性。本窗口跳转是一种方式，打开新窗口也是一种方式，打开新窗口用的更加多。如果a标签里面设置name属性，那么#name名称，那么相当于瞄点。原创 2023-06-29 09:08:52 · 2550 阅读 · 0 评论 -
Html span标签的详细介绍
HTML 中的 Span 标记用于通过使用元素类或 id 属性为特定内容提供样式。CSS text-overflow：这是 span 标记最有用的属性，它有助于我们识别未显示的溢出内容，这些内容应向用户发出信号。CSS word-spacing： span 标记中的此属性用于管理单词之间的间距。CSS color： 用于为文本内容和文本修饰着色的 span 标记的此属性。span标签是使用来组合文档中的行内元素，以便使用样式来对它们进行格式化。span标签通常使用来将文本的一部分或者文档的一部分独立出来，原创 2023-06-15 10:43:47 · 18201 阅读 · 0 评论 -
HTML 下拉选择框select 按钮input 块div
超链接就是用来跳转到路径上面。herf是和a标签一起使用的，超链接一般都是使用a标签的，herf只是标签a里面的一个属性。你得先定义是ul还是ol，定义好了之后再到里面填写具体的内容。有序还是无序使用外层的结构就行了。ol ul是去控制其是有序还是无序，以及有序无序的列表的样式通过type来控制。自带换行的比如h，以及段落，其他的都不会自动换行。HTML是由标签和内容构成的。原创 2023-06-12 15:56:42 · 2012 阅读 · 0 评论 -
Html 表格标签和表单标签
表单是用来采集用户的输入数据，然后将数据提交给服务器。原创 2023-06-12 15:30:14 · 813 阅读 · 0 评论 -
CSS 样式语言 选择器
层叠样式表，是一种样式表语言，用来描述HTML和XML文档的呈现。随着HTML的发展，为了满足页面设计者的要求，HTML添加了很多显示功能，但是随着这些功能的增加，使得HTML越来越杂乱，HTML 页面也越来越臃肿，CSS便随之诞生。CSS 用于简化HTML标签，把关于样式部分的内容提取出来，进行单独的控制，使结构与样式分离开发。CSS 是以HTML为基础，设置网页的外观显示样式，如字体、颜色、背景的控制及整体的布局等，和 HTML 类似CSS也不是真正的编程语言，甚至不是标记语言。原创 2023-06-10 10:33:35 · 988 阅读 · 0 评论 -
JavaScript库：jQuery 选择器、操作元素、操作样式
jQuery就直接$符号，将其选择器添进来，直接再来.click完事，最后将方法传进去。如果匹配的元素拥有名为classname的类别，则hasClass()方法返回True;否则返回False。后面学到组件库的时候，它其实是帮你封装好好的组件，比如form表单组件和table组件，可以通过class指定HTML元素的类别，jquery中与CSS类别有关的方法。这边定义了两个button，第一个给js使用的，第二个jQuery使用的。帮你操作了dom元素，不需要你去关心对dom元素的操作了。原创 2023-06-10 10:05:50 · 532 阅读 · 0 评论 -
JavaScript 客户端脚本语言 选择器、事件
使网页具有交互性（如果不去使用js，只是使用html css那么只是一些死的页面，那么你去点击一个按钮，你去做一些相关的动作，点击一个按钮，发起一个请求除了form表单提供发起请求的能力，那么别的就没有了，动作这一块全部都是使用js去控制），例如响应用户点击，给用户提供更好的体验。在最初期的时候，使用js html以及css去写前端，你需要自己去维护所有的动态操作，那么这些工作量是巨大的，自从高度封装的框架以及组件库出现了之后，它其实帮助我们代替了很多很多的工作。原创 2023-06-01 09:24:53 · 507 阅读 · 0 评论 -
CSS 常用属性 边距、字体font、文本text、边框border、背景background
到border其实都是整个div，在边框外面margin就是div之外的东西了，就是外边距，只有margin会影响div外部的布局。1) 内边距和外边距（在做内边距和外边距大部分的情况是，整体或者小范围的布局也好，在对其方面的调整。内标签是p或者a标签到div边的一个距离，这叫做内边距，是其内部的东西，也就是子标签到内部的距离。上面灰色部分是div，div里面有一张图片，图片的边到四边的距离，其实就是一个内边距，div的边到外部的距离就是一个外边距，灰色的边框就是border了。钻戒到盒子内边框的距离。原创 2023-05-16 16:59:29 · 1539 阅读 · 0 评论 -
HTML 基本骨架、文本格式化标签、列表标签
你得先定义是ul还是ol，定义好了之后再到里面填写具体的内容。有序还是无序使用外层的结构就行了。ol ul是去控制其是有序还是无序，以及有序无序的列表的样式通过type来控制。自带换行的比如h，以及段落，其他的都不会自动换行。原创 2023-05-05 15:34:40 · 159 阅读 · 0 评论