Web前端面试题及答案——HTML&CSS、JS、DOM

虽然个人认为有些知识不是必须记忆的，需要的时候可以查阅笔记，但是对于得到面试的机会还是很重要的。 

HTML&CSS

1、清除浮动的几种方式，各自的优缺点

清除浮动：使父元素围住浮动的子元素，避免对后续元素造成影响。

（1）给父元素设置overflow:hidden;或float:left;或position:absolute;或position:relative;。触发块级格式化上下文（BFC），从正常文档流脱离，父元素本身实现独立布局，围住其中的浮动元素。但专门这样设置，可能会改变布局，对于后三者，使block变为inline-block，父元素宽度变化。

适用于父元素也需要浮动。

（2）在子元素后面添加空的block元素，并设置其样式为clear:both。添加了额外的元素，且block元素带有margin等。

（3）在父元素上加clearfix类名，在父元素的最后加块级元素.（伪元素选择器），通过clear:both使父元素括住浮动的元素来清除float的影响，使.不可见。常用这种方式，Bootstrap支持clearfix类名。

通常推荐这种方式。

  
p1
 
  
p2
 
  

2、块级元素水平垂直居中的方法

  
DEMO

父元素和子元素的大小不确定。

（1）table-cell+inline-block

兼容IE6,7需要把结构换为

，通过display:inline; zoom:1;模拟inline-block。

.parent{display:table-cell; text-align:center; vertical-align:middle;}
.child{display:inline-block;}

（2） relative+absolute+transform

绝对定位脱离文档流，不会对其它元素产生影响。transform是CSS3新增内容，对IE6,7,8可能没法兼容，在高版本浏览器需要加前缀。

.parent{position:relative;}
.child{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}

（3）flex

IE6,7,8可能没法兼容flex。

.parent{display:flex; justify-content:center; align-items:center;}

如果子元素大小确定。

.parent{position:relative;}
.child{
  width:100px; height:100px;
  position:absolute; top:0; right:0; bottom:0; left:0; margin:auto;
}

3、CSS选择器有哪些？优先级如何计算

（1）普通选择器：通配符选择器*、标签选择器、id选择器#、类选择器.、属性选择器[]、伪类选择器:

（2）伪元素选择器::

（3）组合选择器：后代选择器 、子选择器、兄弟选择器+、只要前面有某种元素~

优先级：将权重相加。a=行内样式style，1000；b=id选择器，100；c=类、伪类和属性选择器，10；d=标签选择器和伪元素选择器，1。相同属性优先级高覆盖低、后面覆盖前面，不同属性合并。

超链元素伪类的设置顺序:link :visited :hover :active

4、px、em和rem的区别

px，像素，相对于显示器屏幕分辨率而言；

em，相对长度单位，相对于当前对象内文本的字体大小，若字体大小未显式设置，则相对于浏览器默认的字体大小；

rem，相对长度单位，相对于html根元素的字体大小。

5、display:none和visibility:hidden的区别

display:none设置元素不显示，是彻底消失，不在文档流中占位，浏览器也不会解析该元素。visibility:hidden是视觉上消失，可理解为透明度为0的效果，在文档流中占位，浏览器会解析该元素。

使用visibility:hidden比display:none性能上要好。display:none切换显示时，页面产生回流reflow（页面中的部分元素需要改变规模尺寸、布局、显示隐藏等，页面重新构建）。而visibility:hidden切换是否显示时则不会引起回流，只是元素的外观被改变，且在没有改变布局的情况下发生。

6、用一个div写出三条横线的小图标

div{
  height:5px;
  width:30px;
  background-color:#DD575C;
  background-clip:content-box;
  padding-top:5px;
  padding-bottom:5px;
  border-top:#DD575C solid 5px;
  border-bottom:#DD575C solid 5px;
}

7、用一个div实现倒三角

div{
  width:0;
  border-top:10px solid #DD575C;
  border-left:5.77px solid transparent;
  border-right:5.77px solid transparent;
}

其它方法仅供参考。ASCII码31是倒三角。 

/* 正方形旋转加截取 */
.parentDiv {
  height:50px;
  overflow:hidden;
}
.triangleDiv {
  position: relative;
  height:70.7px;
  width:70.7px;
  top:-35.4px;
  left:19.6px;
  background-color:#DD575C;
  transform:rotate(45deg);
}

8、盒模型

在网页中，一个元素占有空间的大小由几个部分构成，其中包括元素的内容（content）、内边距（padding）、边框（border），外边距（margin）四个部分。

标准盒子模型 ＝ margin + border + padding + content （content =  width | height）

IE盒子模型 ＝ margin + content （content = border + padding + width | height）

box-sizing:content-box|border-box  切换标准模型和IE模型

9、position的absolute和fixed的共同点与不同点

共同点：脱离文档流，文档流中没有它的空间，未设置偏移时在原位置。默认宽度为内容宽度。

absolute：绝对定位。参照物为第一个定位元素（非static）/根元素html（与浏览器窗口同等大小的首屏区域）。元素随页面的滚动而滚动。

fixed：固定定位。参照物是视窗。不随页面的滚动而滚动。

10、sprite精灵图

把设计稿上的小图标拼合到同一张图片中，减少网络请求，提升网页加载速度。

①排列常用横向排列和纵向排列。 ②图片之间必须保留孔隙，小图标20像素。如果更改按钮大小，CSS里背景图位置属性不须改变；容错，如果CSS设置错误，不会导致下面图片露出来。③合并原则：同属于一个模块、大小相近、色彩相近。只本页用到的图片合并、集中使用，有状态的图标合并。④IE6不支持PNG24半透明，存两份：高级浏览器PNG24 sprite.png、IE6 PNG-8 sprite_ie.png。

background-image:url("/images/x.png");
background-repeat:no-repeat;
background-position:20px 60px;
background-size:10px 10px;

11、HTML5

表现页面中的章节结构：

嵌入资源：

新的类型：email、url、number、tel、search、range、color、date

新的表单元素（datalist、keygen、output）和属性

getCurrentPosition()、web存储（localStorage、sessionStorage）、拖放

12、CSS3

选择器：属性选择器、伪类选择器

盒模型：box-shadow、box-sizing

边框：border-radius、border-image

背景：background-image、background-size、background-origin、background-clip、渐变

文字特效：text-shadow、text-overflow、word-wrap、word-break、字体@font-face

2D/3D转换：transform、transform-origin、transform-style、perspective、perspective-origin、backface-visibility

过渡和动画：transition、animation、@keyframes

多列布局：column-count、column-width、column-fill、column-gap、column-rule、column-span

用户界面：resize、outline-offset

弹性盒子：flex

13、的alt和title

alt：描述图片含义。地址写错或网络状况不好，无法查看图像时，显示该说明。可用于屏幕阅读软件和搜索引擎。

title：光标悬浮在图像上时以提示的方式显示该特性内容。

14、href和src的区别

href标识超文本引用，在当前元素和引用资源之间建立联系。。当浏览器解析到css文件时会下载，但不会停止对当前文档的处理。

src引用资源，指向外部资源的位置，将外部资源下载并替换当前元素。用在

(function() {
  var a=b=5;
})();
console.log(b); // 5
console.log(a); // Uncaught ReferenceError: a is not defined

2、操作符

使用加法操作符+时，如果其中一个操作数是字符串，则把另一个操作数也转换为字符串，并将两字符串拼接。
var foo=10+'20'; // '1020'

x||y如果x表达式运行结果转换为Boolean值为false，则返回表达式y的运行结果
(window.foo||(window.foo='bar'));
console.log(window.foo); // 'bar'

指针和赋值运算符的执行顺序
var foo={n:1};
var bar=foo; // {n: 1}
foo.x=foo={n:2};
foo.x // undefined
foo // {n: 2}
bar // {n: 1, x: {n: 2}}

3、==和===的区别

===判断左右两边对象或值是否类型相同且值相等。==判断操作符两边对象或值是否相等，类型不同时，使用Number()转换。例外规则，null==undefined，null/undefined进行==运算时不进行隐式类型转换。通常把值转为Boolean值，进行条件判断。

[1]==[1] false

var a="123";
var b="123";
var c="4";
var oa=new String("123");
var ob=new String("123"); var oc=oa; a===oa; //false，a为值类型，oa为对象类型 oa===ob; //false，不是同一个引用 oa===oc; //true，同一个引用 a===b; //true，值相等，且都是值类型 a===c; //false "99"==99; //true new String("99")==99; //true false=="0"; //true 0==null; //false "undefined"==undefined; //false

4、js各类型在转换为Boolean时的规则

 

5、数值

Number()函数，用于任何数据类型。对于字符串向数值型转换，数字、浮点数、十六进制数->十进制数，前导0被忽略；””->0；除此之外（包含非数字等）转换为NaN。

Number(undefined) // NaN
Number(null) // 0
Number(false) // 0
Number('11') // 11
Number('11.2') // 11.2
Number('011') // 11
Number('0x13') // 19
Number('11a') // NaN

parseInt()，忽略空格，找到第一个非空格字符，直到遇到无效字符。第二个参数为转换进制。前导0被忽略。

parseFloat()，前导0被忽略，只解析十进制。如果没有小数点或小数点后都是0则返回整数。 

parseInt('10/01') // 10
parseInt('011') // 11
parseInt('x08') // NaN
parseInt('0x08') // 8
parseInt('11.12a') // 11
parseFloat('11.12a') // 11.12

4、字符串

字符串replace查找字符串替换成目标字符。
第一个参数是RegExp对象或字符串，第二个参数是字符串或函数。要想替换所有字符串，提供正则表达式，指定g标志，否则只替换第一个满足要求的字符串。

split(separator,howmany)方法，按分割符将字符串分割成字符串数组。
第一个参数分隔符是字符串或RegExp对象，第二个参数用于指定数组大小，返回数组不会超过既定大小。

"I have a cat".split("").reverse().join("-") // 't-a-c- -a- -e-v-a-h- -I'

5、正则表达式 

\d：数字[0-9]    \D：[^0-9]
\s：空白字符[\t\n\x0B\f\r]    \S
\w：单词字符[a-zA-Z_0-9]    \W

^ 以...开始    $ 以...结束

*：0到多
+：1到多
?：0或1
{n}：匹配确定的n次
{n,}：至少匹配n次
{n,m}：最少匹配n次且最多匹配m次

var reg=/^w+[^d]+$/;
console.log(reg.test('ww_32r')); // true
console.log(reg.test('123_dskr')); // false
console.log(reg.test('w7_d2')); // false

6、比较typeof和instanceof

（1）typeof运算符 typeof 变量名; //返回字符串 可以识别标准类型（Null除外），不能识别具体的对象类型（Function除外）。 （2）instanceof 变量名 instanceof 类型; 判别内置对象类型、自定义对象类型，不能判别标准类型。给定引用类型的实例则返回true，检测基本类型值返回false。

 

7、包装类类型识别

包装类Boolean、Number、String。所有基本包装类型的对象（new创建）都会被转换为布尔值true，typeof均得到object。

var strObj=new String('abc');
console.log(strObj instanceof String); // true
console.log(typeof strObj=='string'); // false

8、对象的深克隆

function deepClone(obj){}

9、数组

数组的sort()，默认按升序排列，返回排序后的数组。 sort()方法调用每个数组项的toString()方法，比较得到的字符串，即使是数值。sort()方法可以接收一个比较函数作为参数，指定排序方法。比较函数接收两个参数，如果第一个参数位于第二个参数之前则返回一个负数，两个参数相等则返回0，如果第一个参数应该位于第二个参数之后则返回一个正数。

colors.slice(1,4); 截取，取1-3，返回新数组 返回从起始位置到结束位置-1的项；只有一个参数，则至数组末尾；有负数，则与length相加；结束位置小于起始位置则返回空数组。 splice(start, deleteCount[, item1[, item2[, …]]])，从数组中删除或添加元素，并更改数组内容，返回一个数组，该数组包含从原始数组中删除的项。

var foo=[];foo[2]=1;foo.push(2);alert(foo.length); // 4

10、数组去重并排序，打印重复字符及次数

10、函数

var m=1; 
function add(n){ 
  return n=n+1; 
} 
y=add(m); // 4
function add(n) { 
  return n=n+3; 
} 
z=add(m); // 4

a(); // '函数声明'
function a(){
  console.log("函数声明");
}
b(); // Uncaught TypeError: b is not a function
var b=function(){
  console.log('函数表达式');
}

一个函数实现add(1)(2)(3)和add(1,2)不同的调用方式。

function add(...a){
  let sum=0;
  for(let num of a){
    sum+=num;
  }
  function s(...b){
    for(let num of b){
      sum+=num;
    }
    return s;
  }
  s.toString=function(){return sum;}
  return s;
}
console.log(add(2,3)); // 5
console.log(add(2)(3)); // 5
console.log(add(1)(2,3)(4,5,6)); // 21

11、闭包

闭包是指有权访问另一个函数作用域中的变量的函数，由函数和与其相关的引用环境组成。闭包允许函数访问其引用环境中的变量，有可能是外部环境变量，该变量称为自由变量。创建闭包的常见方式，在一个函数内部创建另一个函数。

闭包的应用，保存变量现场。闭包只能取得包含函数中任何变量的最后一个值，但可以强制创建另一个匿名函数强制让闭包的行为符合预期。

闭包的应用，私有作用域的匿名函数。临时需要一些变量，就可以使用私有作用域，限制向全局作用域中添加过多的变量和函数。私有变量包括函数的参数、局部变量和在函数内部定义的其他函数。

for(var i=0;i<6;i++){
  setTimeout(function(){
    console.log(i); // 打印6个6
  },1000);      
}

// ES6语法可以实现打印1 2 3 4吗？
var numbers=[0,1,2,3];
var functions=[];
for(var i=0;num=numbers[i],i

12、call、apply和bind的区别

函数调用时绑定this值：call()、apply()让函数在特定的作用域下进行调用，即设置函数体内this对象的值。扩充函数运行的作用域，对象不需要与方法有任何耦合关系。区别仅在于接受参数的方式不同， call()方法传递的参数逐个列举，第一个参数是作用域；apply()方法接收两个参数，作用域和参数数组。

为函数绑定this值但并不调用：bind()传入新作用域，返回新函数，该函数在bind作用域执行。第二个参数是参数列表，与call一致。

var scope='window';
env={
  scope:'inner',
  getscope:function(){
    console.log(this.scope);
  }
}
env.getscope(); // 'inner'
env.getscope.apply(window); // 'window'
env.getscope.call(window); // 'window'
env.getscope.bind(window)(); // 'window'

var f=env.getscope;
f(); // 'window'

13、垃圾回收机制和内存管理

js具有自动垃圾回收机制，找出不再使用的变量，垃圾收集器按一定时间间隔（影响性能）释放其占用的内存。“标记清除”是目前主流的垃圾回收算法，给当前不使用的值加上标记，再回收内存。另一种算法是“引用计数”，跟踪记录所有值被引用的次数，当代码中存在循环引用现象时会导致问题。及时解除不再使用的全局对象、全局对象属性及循环引用变量的引用，确保有效回收内存。

14、异步加载JS的方式

使用defer属性让脚本在文档完全呈现之后再顺序执行，async属性同样让脚本立即下载延迟执行，但不保证顺序。

动态生成

你可能感兴趣的:(1.1,前端基础,前端基础——html,CSS,JavaScript,ES6)

• CSS利用@font-face使用自定义字符和图标 小前端2018
  昨天发的一个教程被一顿喷，说已经不用图片了，什么图标字体啦，好桑心~~，但也是事实，现在的前端图片越来越少了，相应替换的是css以及图标字体，所以去探测了几个网站，找了一下style.css文件，看看具体的CSS内容，然后发现这是一个很有趣的问题。
• MyBatis之缓存机制详解 AA-代码批发V哥 mybatisJavaEEmybatis
  MyBatis之缓存机制详解一、MyBatis缓存的基本概念1.1缓存的核心价值1.2MyBatis的两级缓存体系二、一级缓存（SqlSession级别缓存）2.1工作原理2.2实战案例：一级缓存演示2.2.1基础用法（默认开启）2.2.2一级缓存失效场景2.3一级缓存的特点与适用场景三、二级缓存（Mapper级别缓存）3.1工作原理3.2二级缓存的开启与配置3.2.1全局配置（可选）3.2.2M
• 妙用SIGH模型，寻找个人天赋，形成竞争优势 林畅是个小太阳
  1、SIGN模型介绍1.1S-(self-efficacy或success)自我效能自我效能的意思是，对于做某些事物，你的信心很强，觉得自己肯定能做好。比如，有人特别喜欢梳理、规整，有人特别喜欢解决问题，有人特别喜欢把文本做的很精致等等。1.2I-(instinct)本能本能的意思是，当你还没有开始做这件事情时，你就自动、自发地迫不及待的想要尝试了。那些让你迫不及待、跃跃欲试的事情，就有可能蕴藏着
• 《Cocos2d-x实战 Lua卷》上线了
  感谢大家一直以来的支持！各大商店均开始销售：京东：http://item.jd.com/11659697.html当当：http://product.dangdang.com/23659810.html《Cocos2d-x实战Lua卷》源码及样章下载地址：源码下载地址：http://51work6.com/forum.php?mod=viewthread&tid=1198&extra=page%3
• webkitSpeechRecognitionHTML5语音识别文字（直接运行） AIGC创想家 html5语音识别前端
  前端想要实现语音转文字，其实不需要任何云服务，浏览器自带的api就能搞定。下面是已经封装好的代码，复制之后可以在控制台只接运行。classSpeechRecognitionManager{??tempTranscript=''??isRecording=false;??timeoutid=0;??exitKeywors=['stop','exit','quit','退出','停止识别','说完了'
• 【电机驱动与运动控制】考试论述题 宇宙爆肝锦标赛冠军 笔记电机考试
  文章目录0.要求1.传动机构和直流电机与机器人1.1问题描述1.2解决方案1.2.1调速系统的建立1.2.2对调速系统控制方式的改进1.2.3仿真分析1.3自己改进想法1.4参考文献2.交流/步进电机与机器人2.1问题描述2.2解决方案2.2.2缺点2.3自己改进想法2.4参考文献3.考试技巧与考试内容0.要求简短的问题描述解决方案以及必要的解释与论述（优缺点、可行性分析）该方法的不足以及自己的改
• 基于Spring Boot的超市管理系统详细设计方案 漫逗科技 springboot后端java毕业设计课程设计毕设
  基于SpringBoot的超市管理系统详细设计方案1.系统总体设计1.1系统架构图┌─────────────────────────────────────────────────┐│客户端层││┌───────────┐┌───────────┐┌───────────┐│││Web端││移动端App││POS终端│││└───────────┘└───────────┘└──────────
• 【iOS】锁[特殊字符]
  文章目录前言1️⃣什么是锁？1.1基本概念1.2锁的分类2️⃣OC中的常用锁2.1OSSpinLock（已弃用）：“自旋锁”的经典代表为什么尽量在开发中不使用自旋锁自旋锁的本质缺陷：忙等待（BusyWaiting）os_unfair_lock的局限性：不适用于复杂场景苹果的官方建议：优先使用更高效的锁2.2dispatch_semaphore_t（GCD信号量）：“高性能通用锁”2.3pthrea
• 前端面试题 xkxnq 前端开发问题前端
  CSS常见问题解答1.CSS盒模型CSS盒模型由内容区域（content）、内边距（padding）、边框（border）和外边距（margin）组成，分为两种类型：标准盒模型：元素宽度=content宽度替代盒模型（通过box-sizing:border-box设置）：元素宽度=content+padding+border2.CSS选择器的优先级优先级从高到低：!important（覆盖所有规则
• 计算机等级保护2.0标准,等级保护2.0基本要求-二级三级对比表 weixin_39610722 计算机等级保护2.0标准
  《等级保护2.0基本要求-二级三级对比表》由会员分享，可在线阅读，更多相关《等级保护2.0基本要求-二级三级对比表(22页珍藏版)》请在人人文库网上搜索。1、1一般技术要求1.1安全的物理环境需要满足要求的，不需要满足要求的或空的序列号姓名具体要求二级三年级1物理位置的选择a)机房应位于具有防震、防风、防雨功能的建筑内；b)机房应避免在建筑物的顶层或地下室，否则应加强防水防潮措施。2物理访问控制计
• Hadoop与图像识别与处理 AI天才研究院 AI大模型企业级应用开发实战AgenticAI实战AI人工智能与大数据计算科学神经计算深度学习神经网络大数据人工智能大型语言模型AIAGILLMJavaPython架构设计AgentRPA
  Hadoop与图像识别与处理作者：禅与计算机程序设计艺术/ZenandtheArtofComputerProgramming1.背景介绍1.1问题的由来在大数据时代，数据的爆炸性增长对数据处理技术提出了新的挑战。图像数据作为一种重要的数据形式，其处理和分析在许多领域中具有重要意义，如医疗影像分析、自动驾驶、安防监控等。然而，传统的图像处理方法在面对海量图像数据时显得力不从心。Hadoop作为一种分
• 网络数据分层封装与解封过程的详细说明 两圆相切 网络规划设计师网络
  网络数据分层封装全流程数据封装流程（发送端）-CSDN优化版OSI层次封装动作数据单元关键头部信息示例应用层添加应用层协议头部报文(Message)GET/index.htmlHTTP/1.1Host:www.example.com表示层数据加密/压缩PPDUTLSv1.3RecordLayerContentType:ApplicationData会话层添加会话控制标识SPDUSIPCall-ID
• 基于taro开发微信小程序（二） 哈哈哈哈蜜瓜 微信小程序taro小程序
  参考文档目录结构|Taro文档目录项目运行起来之后，了解一下目录├──dist编译结果目录|├──config项目编译配置目录|├──index.js默认配置|├──dev.js开发环境配置|└──prod.js生产环境配置|├──src源码目录|├──pages页面文件目录||└──indexindex页面目录||├──index.jsindex页面逻辑||├──index.cssindex页面
• Python Matplotlib中的fontdict参数说明 @MMiL PyBuildpythonmatplotlibpandasnumpy
  文章目录1fontdict参数的常用属性1.1使用示例1.2其他注意事项1.3结合其他参数各位老板好,在Python的Matplotlib库中，fontdict参数用于定义文本属性的字典。这些属性包括字体大小、颜色、样式等，主要用于控制标题、标签和其他文本元素的显示效果。通过将fontdict传递给相关函数（如plt.title、plt.xlabel等），可以自定义文本的外观。1fontdict参
• websocket和https的区别 一路向北he websockethttps网络协议
  1.WebSocket是双向通信特点：全双工（Full-Duplex）：客户端和服务器可以同时主动发送消息，无需等待请求-响应周期。长连接：建立连接后保持开放，适合实时交互（如聊天、游戏）。类比：类似电话通话，双方随时可以说话。2.HTTPS是“半双工”通信（基于请求-响应）特点：客户端发起请求，服务器返回响应：每次通信需要明确的请求触发（如浏览器加载网页）。短连接（默认）：HTTP/1.1后支持
• 一文详解REST风格 AA-代码批发V哥 JavaEE开发技巧/知识restful
  一文详解REST风格一、REST风格的核心概念1.1什么是REST？1.2REST与HTTP的关系二、REST风格的核心原则2.1资源为中心，URI表示资源2.2用HTTP方法表示操作类型2.3用HTTP状态码表示结果2.4响应格式标准化2.4.1成功响应2.4.2错误响应2.5无状态通信三、RESTfulAPI设计实战案例3.1资源定义3.2API设计清单3.3进阶设计：关联资源与过滤排序3.3
• Spring之事务使用指南 AA-代码批发V哥 springJavaEEspring
  Spring之事务使用指南一、事务的基础概念1.1什么是事务？1.2事务的ACID特性1.3Spring事务的核心优势二、Spring事务的核心配置三、事务传播行为（Propagation）3.1常用传播行为详解3.1.1`REQUIRED`（默认值）3.1.2`SUPPORTS`3.1.3`REQUIRES_NEW`3.1.4`NEVER`3.1.5`MANDATORY`3.2传播行为选择原则四
• 深入解析Linux命令：创建目录mkdir的全面指南 梦幻南瓜 linuxlinux服务器运维
  在Linux操作系统中，mkdir命令是创建目录的基础工具。无论是系统管理员还是普通用户，掌握mkdir的使用方法都是必不可少的。本文将详细解读mkdir命令的用法、选项及其在实际操作中的应用场景。1.mkdir命令的基本用法mkdir是“makedirectory”的缩写，用于在指定路径下创建新目录。其基本语法如下：mkdir[选项]目录名1.1创建单个目录最简单的用法是创建一个目录。例如，要在
• docker磁盘空间不足解决办法 win_zcj dockereureka容器
  摘抄自：https://www.cnblogs.com/jun-zhou/p/15086657.html说明：用yuminstalldocker安装的docker默认安装目录在/var/lib/docker/，/var目录很小，需要改换更大的磁盘空间存储1.查看docker镜像存放目录空间大小du-hs/var/lib/docker/2.停止docker服务。systemctlstopdocker
• python 协程进阶 cliffordl asyncpythonpython开发语言
  python协程实现python协程进阶python生成器的作用协程在多个模型流式输出中的使用实例文章目录1.协程基础1.1.协程名词解释1.2.基本工作流程1.3.async协程执行1.3.1.协程顺序执行（asyncio.run）1.3.2.协程顺序执行（await）1.3.3.协程同步执行（asyncio.create_task）2.可等待对象（Awaitables）2.1.Coroutin
• Packaging软件：Amkor二次开发_（11）.常见问题与解决方法 kkchenkx 半导体制造与电力电子节能系统仿真芯片制造仿真半导体制造芯片仿真
  常见问题与解决方法在使用和二次开发AmkorPackaging软件的过程中，经常会遇到一些技术问题。本节将详细介绍一些常见的问题及其解决方法，帮助开发者更好地应对这些挑战。1.安装与配置问题1.1依赖库安装失败问题描述在安装AmkorPackaging软件时，可能会遇到依赖库安装失败的问题。这通常会导致软件无法正常运行，或者在运行某些特定功能时出现错误。解决方法检查依赖库版本：确保所有
• Python爬虫实战：深入无限滚动页面抓取原理与Playwright实现 Python爬虫项目 python爬虫开发语言区块链json
  一、前言：无限滚动页面的挑战在现代Web开发中，「无限滚动（InfiniteScrolling）」早已取代了传统的分页模式。以微博热搜流、知乎首页、抖音推荐页为例，用户向下滚动时会自动加载更多内容，这种体验虽提升了交互性，却让传统爬虫面临巨大挑战：页面初始只加载一部分内容剩余内容由JavaScript在滚动事件中动态加载requests类爬虫无法感知页面行为为什么传统爬虫抓不到数据？因为页面数据不
• YOLO V8+Python训练手写数字识别 yuanpan YOLOpython开发语言
  以下是针对Windows11+Python环境的详细步骤说明，从数据集整理到模型训练，全部适配YOLOv8流程。1.数据集整理（MNIST→YOLO格式）1.1下载MNIST数据集MNIST数据集可通过Python直接下载（无需手动下载）：python复制fromtorchvision.datasetsimportMNISTimportos#自动下载MNIST数据集（图片和标签）train_dat
• Python爬虫实战：研究Korean库相关技术 ylfhpy 爬虫项目实战python爬虫easyuikorean
  一、引言1.1研究背景与意义随着韩流文化在全球的传播，韩语网页内容急剧增加。韩国在科技、娱乐等领域的信息具有重要研究价值。然而，韩语独特的黏着语特性（如助词体系、词尾变化）给信息处理带来挑战。传统爬虫缺乏对韩语语言特点的针对性处理，本研究旨在开发一套完整的韩语网页内容分析系统，填补这一技术空白。1.2研究目标与方法研究目标：设计高效的韩语网页爬虫框架实现精准的韩语内容识别与处理构建多维度的韩语内容
• Linux部署Milvus数据库及Attu UI工具完全指南
  一、准备工作1.1环境要求操作系统：Ubuntu20.04/Debian11/CentOS7+硬件配置：至少8GB内存，4核CPU，50GB磁盘空间网络要求：可访问互联网（用于拉取Docker镜像）1.2安装Docker和DockerCompose1.2.1安装Dockersudoapt-getupdatesudoapt-getinstall-ydocker.iosudosystemctlstar
• 内容安全策略（CSP）详解：Web安全的关键防线 KP_0x01 web安全web安全安全
  目录一、CSP基础概念与核心价值1.1CSP的核心优势1.2主要防护目标二、CSP策略配置详解2.1基本指令集2.2典型配置方案三、高级防护技术与实践3.1非ce替代方案3.2哈希与nonce应用3.3常见配置错误与修正一、CSP基础概念与核心价值内容安全策略（ContentSecurityPolicy）是一种通过HTTP头或元素定义的安全标准，用于精确控制网页可以加载哪些外部资源，从根本上减少X
• Python+Allpairspy实战：高效正交法测试用例设计全攻略 聪明的一休哥哥 测试开发技术大全python测试用例自动化测试
  引言：正交法的核心价值正交实验法是一种通过科学筛选参数组合来优化测试用例设计的技术。其核心思想是从所有可能的参数组合中，选择最具代表性的N个组合进行测试，既能显著减少用例数量（通常可减少30%-70%），又能保证覆盖关键场景。例如：传统全组合测试：3因素×3水平=27种组合正交法优化后：仅需4-9种组合即可覆盖核心场景1、Allpairspy库安装与基础使用1.1、安装命令pipinstallal
• 渗透攻击红队百科全书 绝不原创的飞龙 渗透
  据说原始扫描件有病毒，我就解析Xref提取图片然后重新生成了一份。我也拿不到纸质书，根据网上流传的版本加工了一下，不清楚是肯定的。其他的不说了，懂的都懂。目录第一章信息搜集1.1主机发现1.2关联信息生成1.3开放漏洞情报1.4开源情报信息搜集(OSINT)1.5GithubHacking1.6GoogleHacking1.7Gitlcret1.8Mailsniper.psl获取Outlook所有
• 周总结5.29-6.3 Sandra_n vuevue.js数据结构
  1.混入应用的是样式？【场景】2.es6/优化==继续看3.树组件操作：数据扁平化/模糊检索{也是把数据结构改了一下复制的ant官网}/默认展开收起{中途有问题比如不默认展开：判断数据删除某一节点展开等}/只呈现查询内容适合调接口{中途研究了一下树id和内容映射[人员树专业树]数据处理}4.置空下拉框v-model设为undefined就提示placeholder了也可以在某项想要的操作后设置初始
• Python包高级开发技术：性能优化与系统集成 软考和人工智能学堂 Python开发经验深度学习强化学习python性能优化开发语言
  引言掌握Python包的高级开发技术是构建工业级应用的关键。本文将深入探讨Python包的性能优化策略、C扩展开发、异步IO集成以及跨语言互操作等高级主题，帮助你将Python包提升到专业水平。1.性能优化技术1.1性能分析工具链#性能分析工具矩阵perf_tools={'cProfile':'标准库分析器，提供函数级耗时统计','line_profiler':'行级分析器，需要@profile装
• Linux的Initrd机制 被触发 linux
  Linux 的 initrd 技术是一个非常普遍使用的机制，linux2.6 内核的 initrd 的文件格式由原来的文件系统镜像文件转变成了 cpio 格式，变化不仅反映在文件格式上， linux 内核对这两种格式的 initrd 的处理有着截然的不同。本文首先介绍了什么是 initrd 技术，然后分别介绍了 Linux2.4 内核和 2.6 内核的 initrd 的处理流程。最后通过对 Lin
• maven本地仓库路径修改 bitcarter maven
  默认maven本地仓库路径：C:\Users\Administrator\.m2 修改maven本地仓库路径方法：     1.打开E:\maven\apache-maven-2.2.1\conf\settings.xml     2.找到        
• XSD和XML中的命名空间 darrenzhu xmlxsdschemanamespace命名空间
  http://www.360doc.com/content/12/0418/10/9437165_204585479.shtml http://blog.csdn.net/wanghuan203/article/details/9203621 http://blog.csdn.net/wanghuan203/article/details/9204337 http://www.cn
• Java 求素数运算 周凡杨 java算法素数
  网络上对求素数之解数不胜数，我在此总结归纳一下，同时对一些编码，加以改进，效率有成倍热提高。 第一种：   原理: 6N(+-)1法         任何一个自然数，总可以表示成为如下的形式之一： 6N，6N+1，6N+2，6N+3，6N+4，6N+5 (N=0，1，2，…)   
• java 单例模式 g21121 java
  想必单例模式大家都不会陌生，有如下两种方式来实现单例模式：   class Singleton { private static Singleton instance=new Singleton(); private Singleton(){} static Singleton getInstance() { return instance; }
• Linux下Mysql源码安装 510888780 mysql
  1.假设已经有mysql-5.6.23-linux-glibc2.5-x86_64.tar.gz (1)创建mysql的安装目录及数据库存放目录       解压缩下载的源码包，目录结构，特殊指定的目录除外：           
• 32位和64位操作系统 墙头上一根草 32位和64位操作系统
  32位和64位操作系统是指：CPU一次处理数据的能力是32位还是64位。现在市场上的CPU一般都是64位的，但是这些CPU并不是真正意义上的64 位CPU，里面依然保留了大部分32位的技术，只是进行了部分64位的改进。32位和64位的区别还涉及了内存的寻址方面，32位系统的最大寻址空间是2 的32次方= 4294967296（bit）= 4（GB）左右，而64位系统的最大寻址空间的寻址空间则达到了
• 我的spring学习笔记10-轻量级_Spring框架 aijuans Spring 3
  一、问题提问：     → 请简单介绍一下什么是轻量级？     轻量级（Leightweight）是相对于一些重量级的容器来说的，比如Spring的核心是一个轻量级的容器，Spring的核心包在文件容量上只有不到1M大小，使用Spring核心包所需要的资源也是很少的，您甚至可以在小型设备中使用Spring。  
• mongodb 环境搭建及简单CURD antlove WebInstallcurdNoSQLmongo
  一 搭建mongodb环境 1. 在mongo官网下载mongodb 2. 在本地创建目录 "D:\Program Files\mongodb-win32-i386-2.6.4\data\db" 3. 运行mongodb服务 [mongod.exe --dbpath "D:\Program Files\mongodb-win32-i386-2.6.4\data\
• 数据字典和动态视图 百合不是茶 oracle数据字典动态视图系统和对象权限
  数据字典（data dictionary）是 Oracle 数据库的一个重要组成部分，这是一组用于记录数据库信息的只读（read-only）表。随着数据库的启动而启动,数据库关闭时数据字典也关闭   数据字典中包含   数据库中所有方案对象（schema object）的定义(包括表，视图，索引，簇，同义词，序列，过程，函数，包，触发器等等) 数据库为一
• 多线程编程一般规则 bijian1013 javathread多线程java多线程
         如果两个工两个以上的线程都修改一个对象，那么把执行修改的方法定义为被同步的，如果对象更新影响到只读方法，那么只读方法也要定义成同步的。        不要滥用同步。如果在一个对象内的不同的方法访问的不是同一个数据，就不要将方法设置为synchronized的。
• 将文件或目录拷贝到另一个Linux系统的命令scp bijian1013 linuxunixscp
  一.功能说明        scp就是security copy，用于将文件或者目录从一个Linux系统拷贝到另一个Linux系统下。scp传输数据用的是SSH协议，保证了数据传输的安全，其格式如下：        scp 远程用户名@IP地址：文件的绝对路径
• 【持久化框架MyBatis3五】MyBatis3一对多关联查询 bit1129 Mybatis3
  以教员和课程为例介绍一对多关联关系，在这里认为一个教员可以叫多门课程，而一门课程只有1个教员教，这种关系在实际中不太常见，通过教员和课程是多对多的关系。   示例数据：   地址表：   CREATE TABLE ADDRESSES ( ADDR_ID INT(11) NOT NULL AUTO_INCREMENT, STREET VAR
• cookie状态判断引发的查找问题 bitcarter formcgi
  先说一下我们的业务背景： 1.前台将图片和文本通过form表单提交到后台，图片我们都做了base64的编码，并且前台图片进行了压缩 2.form中action是一个cgi服务 3.后台cgi服务同时供PC，H5，APP 4.后台cgi中调用公共的cookie状态判断方法（公共的，大家都用，几年了没有问题） 问题：（折腾两天。。。。） 1.PC端cgi服务正常调用，cookie判断没
• 通过Nginx,Tomcat访问日志(access log)记录请求耗时 ronin47
  一、Nginx通过$upstream_response_time $request_time统计请求和后台服务响应时间 nginx.conf使用配置方式： log_format main '$remote_addr - $remote_user [$time_local] "$request" ''$status $body_bytes_sent "$http_r
• java-67- n个骰子的点数。 把n个骰子扔在地上，所有骰子朝上一面的点数之和为S。输入n，打印出S的所有可能的值出现的概率。 bylijinnan java
  public class ProbabilityOfDice { /** * Q67 n个骰子的点数 * 把n个骰子扔在地上，所有骰子朝上一面的点数之和为S。输入n，打印出S的所有可能的值出现的概率。 * 在以下求解过程中，我们把骰子看作是有序的。 * 例如当n=2时，我们认为（1，2）和（2，1）是两种不同的情况 */ private stati
• 看别人的博客，觉得心情很好 Cb123456 博客心情
     以为写博客，就是总结，就和日记一样吧，同时也在督促自己。今天看了好长时间博客:    职业规划:    http://www.iteye.com/blogs/subjects/zhiyeguihua      android学习:    1.http://byandby.i
• [JWFD开源工作流]尝试用原生代码引擎实现循环反馈拓扑分析 comsci 工作流
      我们已经不满足于仅仅跳跃一次，通过对引擎的升级，今天我测试了一下循环反馈模式，大概跑了200圈，引擎报一个溢出错误      在一个流程图的结束节点中嵌入一段方程，每次引擎运行到这个节点的时候，通过实时编译器GM模块，计算这个方程，计算结果与预设值进行比较，符合条件则跳跃到开始节点，继续新一轮拓扑分析，直到遇到
• JS常用的事件及方法 cwqcwqmax9 js
  事件 描述 onactivate 当对象设置为活动元素时触发。 onafterupdate 当成功更新数据源对象中的关联对象后在数据绑定对象上触发。 onbeforeactivate 对象要被设置为当前元素前立即触发。 onbeforecut 当选中区从文档中删除之前在源对象触发。 onbeforedeactivate 在 activeElement 从当前对象变为父文档其它对象之前立即
• 正则表达式验证日期格式 dashuaifu 正则表达式IT其它java其它
  正则表达式验证日期格式 function isDate(d){ var v = d.match(/^(\d{4})-(\d{1,2})-(\d{1,2})$/i); if(!v) { this.focus(); return false; } } <input value="2000-8-8" onblu
• Yii CModel.rules() 方法 、validate预定义完整列表、以及说说验证 dcj3sjt126com yii
  public array rules () {return} array 要调用 validate() 时应用的有效性规则。 返回属性的有效性规则。声明验证规则，应重写此方法。 每个规则是数组具有以下结构：array('attribute list', 'validator name', 'on'=>'scenario name', ...validation
• UITextAttributeTextColor = deprecated in iOS 7.0 dcj3sjt126com ios
  In this lesson we used the key "UITextAttributeTextColor" to change the color of the UINavigationBar appearance to white. This prompts a warning "first deprecated in iOS 7.0." Ins
• 判断一个数是质数的几种方法 EmmaZhao Mathpython
  质数也叫素数，是只能被1和它本身整除的正整数，最小的质数是2，目前发现的最大的质数是p=2^57885161-1【注1】。 判断一个数是质数的最简单的方法如下： def isPrime1(n): for i in range(2, n): if n % i == 0: return False return True 但是在上面的方法中有一些冗余的计算，所以
• SpringSecurity工作原理小解读 坏我一锅粥 SpringSecurity
    SecurityContextPersistenceFilter   ConcurrentSessionFilter   WebAsyncManagerIntegrationFilter   HeaderWriterFilter   CsrfFilter   LogoutFilter   Use
• JS实现自适应宽度的Tag切换 ini JavaScripthtmlWebcsshtml5
  效果体验：http://hovertree.com/texiao/js/3.htm   该效果使用纯JavaScript代码，实现TAB页切换效果，TAB标签根据内容自适应宽度，点击TAB标签切换内容页。 HTML文件代码： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"
• Hbase Rest API : 数据查询 kane_xie RESThbase
  hbase（hadoop）是用java编写的，有些语言（例如python）能够对它提供良好的支持，但也有很多语言使用起来并不是那么方便，比如c#只能通过thrift访问。Rest就能很好的解决这个问题。Hbase的org.apache.hadoop.hbase.rest包提供了rest接口，它内嵌了jetty作为servlet容器。   启动命令：./bin/hbase rest s
• JQuery实现鼠标拖动元素移动位置（源码+注释） 明子健 jqueryjs源码拖动鼠标
  欢迎讨论指正！   print.html代码： <!DOCTYPE html> <html> <head> <meta http-equiv=Content-Type content="text/html;charset=utf-8"> <title>发票打印</title> &l
• Postgresql 连表更新字段语法 update qifeifei PostgreSQL
  下面这段sql本来目的是想更新条件下的数据，可是这段sql却更新了整个表的数据。sql如下： UPDATE tops_visa.visa_order SET op_audit_abort_pass_date = now() FROM tops_visa.visa_order as t1 INNER JOIN tops_visa.visa_visitor as t2 ON t1.
• 将redis,memcache结合使用的方案? tcrct rediscache
  公司架构上使用了阿里云的服务，由于阿里的kvstore收费相当高，打算自建，自建后就需要自己维护，所以就有了一个想法，针对kvstore(redis)及ocs(memcache)的特点，想自己开发一个cache层，将需要用到list，set，map等redis方法的继续使用redis来完成，将整条记录放在memcache下，即findbyid，save等时就memcache，其它就对应使用redi
• 开发中遇到的诡异的bug wudixiaotie bug
  今天我们服务器组遇到个问题： 我们的服务是从Kafka里面取出数据，然后把offset存储到ssdb中，每个topic和partition都对应ssdb中不同的key，服务启动之后，每次kafka数据更新我们这边收到消息，然后存储之后就发现ssdb的值偶尔是-2,这就奇怪了，最开始我们是在代码中打印存储的日志，发现没什么问题，后来去查看ssdb的日志，才发现里面每次set的时候都会对同一个key

按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他

首页 - 关于我们 - 站内搜索 - Sitemap - 侵权投诉

版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.