摘要： 在开发聊天或者留言之类的功能的时候，通常需要过滤敏感词，下面总结了两种方法。 1、迭代敏感字数组，拼接过滤敏感字正则，然后利用 replace 把匹配到的敏感字替换为* dom结构如下： js代码如下： 2、迭代敏感字数组，将输入内容中的敏感字替换为“*” dom结构如下： js代码如下： 对比两种 阅读全文

摘要： 1、利用定位实现 css代码如下： dom结构如下： 2、利用 display: flex 实现 css代码如下： dom结构如下： 3、利用 float 实现 css代码如下： dom结构如下： 实现效果如下图： 需要注意的是最后一种方法的dom结构是有变化的，浮动元素要写在前面。 如有表述不准确 阅读全文

摘要： 一个面试会问的问题，如何实现两个盒子，左侧固定宽度，右侧自适应。 1、利用 calc 计算宽度的方法 css代码如下： dom结构如下： 2、利用 float 配合 margin 实现 css代码如下： dom结构如下： 3、利用 float 配合 overflow 实现 css代码如下： dom结 阅读全文

摘要： 前端开发中经常会遇到 input 取值区间的需求，比如搜索的时候，价格区间，积分值区间 大致的需求为 input 的值必须是正整数，第二个 input 的值必须大于第一个 dom结构如下： js代码如下： 整个方法主要为两部分： 1. 利用 oninput 方法在输入的时候控制输入内容必须是数字，且 阅读全文

摘要： 如有表述不准确之处，欢迎指正，欢迎补充，感谢阅读。 阅读全文

摘要： 值 描述 text 默认。定义单行输入字段，用户可在其中输入文本。默认是 20 个字符 button 定义可点击的按钮（大多与 JavaScript 使用来启动脚本） checkbox 定义复选框 radio 定义单选按钮 submit 定义提交按钮。提交按钮向服务器发送数据 password 定义 阅读全文

摘要： 整理下常用的居中方法 1.采用 display:flex 方法 2.采用 display:table-cell 方法 需要注意的是第二种方法如果子元素为块级标签的话，需要设置其 display：inline-block; ，转为行块级标签 3.采用定位方法 或者 如有表述不准确之处，欢迎指正，欢迎补 阅读全文

摘要： 前端开发中，常常会有需求两个盒子并排排列，高度以最高的为准，且高度是内容撑开的，类似于这样 如果不是用 table 布局，而是用 div 布局，两个子盒子浮动来实现的话，实际上默认写出来是这样的 此时需要给两个子盒子设置 padding-bottom: 9999px;margin-bottom: - 阅读全文

摘要： 实际项目中，常常会遇到一排行内元素对齐排列的需求，但是往往它们是这样的 我们想要的其实是这样的 曾经我一度不得不使用定位来实现我想要的位置效果，将父元素设置 position:relative ,行内元素设置 position:absolute ,然后利用 top 和 left 实现定位 直到有一天 阅读全文

摘要： HTML代码如下： CSS代码如下： 效果如下 IE下效果如下 如有表述不准确之处，欢迎指正，欢迎补充，感谢阅读。 阅读全文