原生JS
WE丕样
会当凌绝顶,一览四海平
展开
-
JS合并多个对象数组
JS对象数组合并原创 2022-06-28 15:51:44 · 636 阅读 · 1 评论 -
JS递归实现DOM树状结构
数据结构<!-- 后台返回还有其它的内容,但是这里对于生成DOM结构没用上,而且过多,就没写 -->let data = { private:[ { childCategories:[ { childCategories: [ { childCategories: []原创 2020-10-15 15:22:17 · 1333 阅读 · 0 评论 -
拖拽解锁
预览HTML<div class="slider-box"> 拖动滑块验证 <div class="slider-mask" data-text="拖动滑块验证"> <div class="slider-ele" id="slider-ele"></div> </div></div>CSS.slider-box{ width: 300px; height: 40px; margin: 200px auto;原创 2020-06-05 18:02:04 · 245 阅读 · 0 评论 -
canvas水印
主要记录水印部分,如下:HTML和CSS就不写了JavaScript封装的部分:function time(split) { let date = new Date(); let year = date.getFullYear(); let month = date.getMonth() + 1; let day = date.getDate(); ...原创 2019-05-15 16:29:25 · 487 阅读 · 0 评论 -
js拖动改变区域大小
先看效果:(拖动蓝色线可改变宽度或者高度)CSS:*{margin: 0;padding: 0;}body,html{width: 100%; height: 100%;background-color: #d2d0d0;}.line{position: absolute;background-color: rgba(0, 191, 255, 0.3);}.line[data-...原创 2019-05-21 15:15:01 · 816 阅读 · 0 评论 -
div 设置contenteditable 之后的placeholder效果
假设有个id为“editBox”的div,需求是1、其可编辑 --->对其设置contenteditable =“true”,即可;2、拥有类似input的“placeholder”效果 --->解决方案如下:// HTML:<div class="container"> <div class="bgholder">请输入内容...原创 2019-05-21 16:35:13 · 1947 阅读 · 0 评论 -
搜索关键字的高亮效果
html:<div class="contaner"> <div class="search_box"> <input type="text" class="" placeholder="搜索" autofocus/> </div> <ul> <li>你好,在的呢!...原创 2019-05-13 17:23:24 · 464 阅读 · 0 评论