草庐IT

前端-全景图-VR

全部标签

【前端HTML】HTML基础

文章目录HTML标签标签属性基本结构文档声明HTML标准结构HTML基础排版标签语义化标签块级元素与行内元素文本标签图片标签超链接跳转到指定页面跳转到文件跳转到锚点唤起指定应用列表有序列表无序列表列表嵌套自定义列表表格基本结构常用属性跨行跨列常用标签表单基本结构常用表单控件文本输入框密码输入框单选框复选框隐藏域提交按钮重置按钮普通按钮文本域下拉框禁用表单控件label标签总体示例表单总结HTMLHTML,HyperTextMarkupLanguage,超文本标记语言。标签标签是HTML的基本组成单位。标签分为:双标签和单标签.标签名不区分大小写,但是推荐小写双标签:标签体单标签:标签属性用于给

浅谈 Angular 和 UI5 这两种前端框架里控件 ID 的设计思路差异

最近笔者在工作中,修复了一些我团队负责的Angular应用里关于控件id的issue,正好我在从事Angular开发之前,使用UI5这个前端开发框架也工作了很多年。虽然二者都是优秀的企业级前端应用的开发框架,但二者无论是从设计理念还是开发思路上来说都有着很大的差异。所谓『管中窥豹,可见一斑』。本文从UI控件元素ID的生成逻辑这个切入点出发,向大家分享我对这两个前端框架设计理念差异的一些理解。我们先用UI5创建一个简单的button控件:UI5控件拥有对应的渲染器,比如Button的渲染器叫做ButtonRenderer,负责渲染出如下图高亮的HTML代码,其中控件ID为__button0.对于

十个前端冷门但好用的前端工具函数库

在前端开发中,有时候我们会遇到一些常见的功能需求,但却不知道从哪里找到合适的工具函数。以下为你推荐10个冷门但好用的前端工具函数仓库,它们可能没有很高的知名度,但却能为你解决实际问题,提高开发效率。1.fns.js说明: fns.js是一个小巧的前端工具函数库,提供了许多实用的函数。它包括数组操作、对象操作、字符串处理、函数工具等常用功能。官网地址: https://www.npmjs.com/package/fns2.utils-lite说明: utils-lite是一个轻量级的前端工具函数库,专注于提供实用的小工具函数。它包括日期处理、数学计算、随机数生成等常用功能。官网地址: https

前端使用intro.js实现页面操作引导

前言Intro.js的官方文档:https://introjs.com/docs/getting-started/install 利用Intro.js实现简单的新手引导 效果:下载依赖配置打开官网Intro.jsDocumentation|Intro.jsDocs(introjs.com)可以看到官网的下载依赖npminstallintro.js--save和yarnaddintro.js当然也可以下载到本地引入使用intro.js-Libraries-cdnjs-The#1freeandopensourceCDNbuilttomakelifeeasierfordevelopers打开连接引入

前端面试集锦(DOM HTTP 框架(Vue))

DOM事件委托参考答案:简易版(有缺陷没有考虑子元素):bug在于,如果用户点击的是li里面的span,就没法触发fn,这显然不对ul.addEventListener(‘click’,function(e){if(e.target.tagName.toLowerCase()===‘li’){fn()//执行某个函数//console.log(‘您点击了li’)}})。高级版:思路是点击span后,递归遍历span的祖先元素看其中有没有ul里面的li。functiondelegate(element,eventType,selector,fn){element.addEventListener

【wx-open-launch-app】微信内置浏览器网页唤起app操作和一些坑,偏前端使用开放标签方面

最近实现了一下微信H5(Android)唤起app功能,使用的是微信开放标签,wx-open-launch-app,使用这个标签后,我们就可以在微信浏览器中唤起对应的app了官方使用教程:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html使用教程需要一个已验证的微信服务号账号和微信开放平台账号,两个账号需要相互绑定,然后在开放平台服务号设置网页跳转移动应用关联引入对应的js文件、通过wx.config获取到对应的标签权限使用标签//在vue中,如果配置好对应的公众号和开放平台,下面的

作为前端leader,如何搭建属于我们公司自己的流水线自动化部署系统(node+express)

背景:自动化部署系统主要可以集成到公司内部的管理系统中去,比如公司有多个项目,移动端H5,大屏网站,门户网站等...每次发布或者迭代都需要前端同事打包然后在交给运维或者后端同事放到服务器上进行部署,如果有一个项目多个同事合作完成还要走git合并流程,所以我们的目标就是不让前端进行打包,开发完成代码后直接提交就行,通过点击管理后台的某个按钮触发某个平台的前端项目自动更新,同时也不需要在交付给运维或者后端,便携式与流程管理,实现自动化部署(这里只说自己实现的,当然你们也可以去接入腾讯或阿里的自动化流水部署系统,但是某些环境下只能使用自己的如何去实现) 这里做一个简单的版本和实现代码,可以自己扩展回

前端-vue+elment-ui之表格自定义列模版

表格自定义列模版文章目录表格自定义列模版前言一、为什么要自定义表列模版?二、实现步骤1.封装表格组件2.父组件引用总结前言日前vue3项目中用elment-ui表格封装一个组件,有自定义表列格式的需求,做完后顺手总结一下一、为什么要自定义表列模版?后端返回的数据往往比较原始,比如状态是数值,而我们要给它转成中文并用不同颜色标记,这种场景很常见二、实现步骤1.封装表格组件代码如下(示例):通过插槽v-slots实现//data-table/index.tsximport{ElPagination,ElTable,ElTableColumn}from"element-plus";import{Pr

热血前端勇闯自动化测试 Playwright + TypeScript 如何debug以及如何使用Cookie

文章目录前言一、如何在运行中debug呢?二、如何使用上下文的Cookie如何下载Playwright以及使用VScode插件运行测试用例前言问:前端做好好的为什么要来卷测试呢?答:因为所有主线流程测试可能不会完全兼顾得到,所以为了能更(yu)好(kuai)的工(mo)作(yu),所以内心就产生了一个邪恶的想法😈假如我提测前把所有的主流程跑一边呢?so请看下文(默认已经安装和了解Playwright了)提示:以下是本篇文章正文内容,系好安全带准备发车!一、如何在运行中debug呢?找到我们下载的PlayWright插件(如何下载请上滑开始部分)(1.点击你想要debug的代码块左侧,会出现小红

[HTML]Web前端开发技术20(HTML5、CSS3、JavaScript )HTML5 基础与CSS3 应用,datetime-local,required,MPEG4——喵喵画网页

希望你开心,希望你健康,希望你幸福,希望你点赞!最后的最后,关注喵,关注喵,关注喵,佬佬会看到更多有趣的博客哦!!!喵喵喵,你对我真的很重要!目录前言HTML5新增的表单属性HTML5新增的input类型HTML5表单新增输入类型HTML5视频与音频CSS3基础应用CSS3浏览器兼容性课后练习网页标题:顺序结构的应用网页标题:if..else语句的应用网页标题:switch结构的应用网页标题:顺序结构的应用总结前言回来啦!HTML5新增的表单属性required属性。required属性规定必须在提交之前填写输入域(不能为空)。min、max和step属性。min、max和step属性用于为包