接着上一篇的：js实现element中可清空的输入框（1）继续优化，感兴趣的可以去看看哟，直通车链接：https://www.cnblogs.com/qcq0703/p/14450001.html
实现效果如下图：https://element.eleme.cn/#/zh-CN/component/input
首先说明一下这一个输入框外形
1、边框圆角
2、可清空按钮
3、空值的时候显示请输入内容
嗯，就这些了。
其次是有哪些功能
1、获得焦点边框高亮
2、输入值时可清空图标
3、点击清空图标，清空内容
4、input失去焦点，不再高亮，也不再显示可清空图标
5、将输入值删除为空时，不再显示可清空图标
6、input中有值，鼠标移到input输入框时，显示可清空图标
接下来就是实现这些外形和功能了
首先分析一下啊，相信你一眼看上去，就会想到应该有一个input输入框，然后有一个放置图标的节点，然后再有一个div外层将这两个元素包围住，那好先来实现
<div id="my_input_div"> <input placeholder="请输入内容"/> <input style="width: 20px;"/> </div>