首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >清除前端标签中(输入框)的内容

清除前端标签中(输入框)的内容

作者头像
鲲志说
发布2025-04-07 18:08:03
发布2025-04-07 18:08:03
59600
代码可运行
举报
运行总次数:0
代码可运行

这个问题还是前段时间遇到,最近双十一刚过,就把遗留的一些小问题来总结一下,这个问题就比较简单了,不做过多解释了。

清除标签中的内容方法:

1.原生js方法

(1)input框中的内容
代码语言:javascript
代码运行次数:0
运行
复制
document.getElementById("inputId").value="";
(2)其他标签的内容
代码语言:javascript
代码运行次数:0
运行
复制
document.getElementById("tagName").innerHTML="";
牢记:

input标签的值是通过value属性来设置的; 其他大多数标签都是通过innerHTML来设置的;

原因:

input是单标签,没有innerHTML属性。只能通过value属性来设置其中的内容; innerHTML 属性可设置或返回单元格的开始标签和结束标签之间的 HTML,即只有双标签才有innerHTML属性。


2.jquery实现

代码语言:javascript
代码运行次数:0
运行
复制
<code id="show"></code>
<a href="javascript:clearWindow();">清除内容</a>
function clearWindow(){
	$("#show").empty();
}
a.
代码语言:javascript
代码运行次数:0
运行
复制
$('#show').html('');
b.
代码语言:javascript
代码运行次数:0
运行
复制
$('#show').empty();

jquery的两种方式有区别:

a方法:

(’#show’).html(’’);会造成内存泄漏,它只清空该对象的内部元素,但是不会清除注册在内部元素上的事件。如果id=show的code标签上还注册有其它事件,那些事件代码也要占用内存。你使用$(’#show’).html(’’);来清空标签的内容,当然也可以清空内容,但是注册在这些code标签上的事件代码并没有被清理掉,这些事件代码仍然保留在内存里,并且无法得到释放。

b方法:

(’#show’).empty();会清空内容和注册在该标签上的事件,因此这样就防止内存泄露。

一般我用到的是js原生方法,jquery实现方法比较少用,一定要避免使用内存泄漏的清空方法

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2025-04-07,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 清除标签中的内容方法:
    • 1.原生js方法
      • (1)input框中的内容
      • (2)其他标签的内容
    • 2.jquery实现
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档