jquery一些常见HTML5的DOM操作代码，监听input输入值变化，css 取消双击选中，jquery 修改input的type为password
jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（框架）于2006年1月由John Resig发布。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。
jquery 监听input输入值变化
在jQuery中，可以使用input事件来监听输入框（< input/>、< textarea>等）的值的变化。以下是一个示例代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Input Value Change Listener</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script>
$(document).ready(function() {
$('#myInput').on('input', function() {
console.log('Input value changed to: ' + $(this).val());
});
});
</script>
</head>
<body>
<input type="text" id="myInput" placeholder="Type something here...">
</body>
</html>在这个例子中，当用户在#myInput元素中输入时，将触发注册的input事件处理函数，并在控制台打印出当前输入框的值。
css 取消双击选中
要取消CSS中的双击（double-click）文本的默认选中行为，可以使用以下CSS代码：
* {
-webkit-user-select: none; /* Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard syntax */
}
/* 针对特定元素取消选中 */
.no-select {
-webkit-user-select: none; /* Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard syntax */
}
使用方法：
全局取消选中，将上述CSS代码应用到所有元素上。
针对特定元素取消选中，给该元素添加no-select类。
HTML示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cancel Double Click Selection</title>
<style>
* {
-webkit-user-select: none; /* Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard syntax */
}
</style>
</head>
<body>
<p>This text will not be selectable on double-click.</p>
<div class="no-select">This text will also not be selectable on double-click.</div>
</body>
</html>
在这个例子中，页面上的所有文本都不能通过双击进行选中，而具有no-select类的div元素也是如此。
jquery 修改input的type为password
在jQuery中，修改input元素的type属性可以直接通过.attr()或.prop()方法来完成，因为这些方法支持修改元素的type属性。同时也可以通过创建一个新的input元素来替换原有的input元素，或者先移除原有的input元素，然后在同样的位置上添加一个新的type为password的input元素。
以下是一个示例代码，展示了如何使用jQuery将一个text类型的input元素的type改变为password类型：
$('#password').attr("type", "text");
参考文献：
1、基于Uni-app前端框架的SUMER UI3.0组件库
2、uniapp精仿支付宝UI界面源码下载，基于SumerUI一款仿支付宝APP
3、uniapp精仿微信源码，基于SumerUI一款仿微信APP应用
SUMER UI【用于开发APP、小程序、H5网站、毕业设计…】
评论