js大小写转换
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML>
<HEAD>
<TITLE>TIAOTIAOtiaowa1</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<script>
function a(){
alert("转换成功！");
document.getElementById("test").value = document.getElementById("test").value.toUpperCase();
}
function b(){
alert("转换成功！");
document.getElementById("test1").value = document.getElementById("test1").value.toLowerCase();
}
</script>
<BODY>
在这里输入小写,会自动转为大写:<br/><textarea style="border: #FF0000 1px solid; overflow: visible; color: black; font-size:20px;background-image: url(https://img03.sogoucdn.com/app/a/201025/7e65fdb5fd3ca37f2d2fc9b9eb64915d);width:800px;height:800px;opacity: 0.5" id=test></textarea><br/><button onclick="a()" >点击我</button><br/>
在这里输入大写,会自动转为小写:<br/><textarea style="border: #FF0000 1px solid; overflow: visible; color: black; font-size:20px;background-image: url(https://img03.sogoucdn.com/app/a/201025/7e65fdb5fd3ca37f2d2fc9b9eb64915d);width:800px;height:800px;opacity: 0.5" id=test1></textarea><br/><button onclick="b()" >点击我</button>
</BODY>
</HTML> 给几个写代码的建议~一是重复的代码尽量只写一次，比如css代码和获取节点的代码；二是提示转换成功在后面转换之后再显示，这比较符合代码逻辑；三是文字尽量都用div等标签包含，不要直接暴露在body下，直接暴露也没问题但是不太美观~加油 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>TIAOTIAOtiaowa1</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style>
textarea {
border: #FF0000 1px solid;
overflow: visible;
color: black;
font-size: 20px;
background-image: url(https://img03.sogoucdn.com/app/a/201025/7e65fdb5fd3ca37f2d2fc9b9eb64915d);
width: 400px;
height: 400px;
opacity: 0.5
}
</style>
</HEAD>
<script>
function a() {
let value = document.getElementById("test").value
value = value.toUpperCase();
console.log('value', value);
if (value !== "") {
alert(`转换成功！转换结果为：${value}`);
} else {
alert("输入字符为空，转换失败");
}
}
function b() {
let value = document.getElementById("test1").value
value = value.toLowerCase();
if (value !== "") {
alert(`转换成功！转换结果为：${value}`);
} else {
alert("输入字符为空，转换失败");
}
}
</script>
<BODY>
<div>在这里输入小写,会自动转为大写:</div><br /><textarea id=test></textarea><br /><button onclick="a()">点击我</button><br />
<div>在这里输入大写,会自动转为小写:</div> <br /><textarea id=test1></textarea><br /><button onclick="b()">点击我</button>
</BODY>
</HTML>
按照一楼的大概改了一下，再加了个输入为空的判断 学习了。 写个代参函数多好；想调哪个节点就调哪个节点 function a() {
transformValue("test");
}
function b() {
transformValue("test1");
}
function transformValue(id) {
const dom = document.getElementById("test1");
if (!dom || !dom.value) return;
const value = dom.value.toLowerCase();
if (value !== "") alert(`转换成功！转换结果为：${value}`);
else alert("输入字符为空，转换失败");
}
能不能提个建议，HTML、HEAD、BODY、TITLE、META能不能不大行啊，再一看script，强迫症都犯了
突然想到，你这段代码，不就是大小写转换的吗？
你懂了吗？ RainPPR 发表于 2022-12-29 16:30
能不能提个建议，HTML、HEAD、BODY、TITLE、META能不能不大行啊，再一看script，强迫症都犯了
突然想到， ...
主要就是用这个代码转一下这个代码 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>TIAOTIAOtiaowa1</title>
<meta name="Generator" content="EditPlus" />
<meta name="Author" content="" />
<meta name="Keywords" content="" />
<meta name="Description" content="" />
<style>
textarea {
border: #ff0000 1px solid;
overflow: visible;
color: black;
font-size: 20px;
background-image: url(https://img03.sogoucdn.com/app/a/201025/7e65fdb5fd3ca37f2d2fc9b9eb64915d);
width: 400px;
height: 400px;
opacity: 0.5;
}
</style>
</head>
<script>
let dataObj = {};
Object.defineProperty(dataObj, "test", {
get: function () {
return 10;
},
set: function (newValue) {
console.log(newValue);
document.getElementById("test1").value = newValue;
},
});
document.addEventListener("keyup", function (event) {
dataObj.test = event.target.value.toUpperCase();
});
let dataObj2 = {};
Object.defineProperty(dataObj2, "test1", {
get: function () {
return 10;
},
set: function (newValue) {
console.log(newValue);
document.getElementById("test").value = newValue;
},
});
document.addEventListener("keyup", function (event) {
dataObj2.test1 = event.target.value.toLowerCase();
});
</script>
<body>
<div>在这里输入小写,会自动转为大写:</div>
<br /><textarea id="test"></textarea><br /><br />
<div>在这里输入大写,会自动转为小写:</div>
<br /><textarea id="test1"></textarea><br />
</body>
</html>
出个双向数据绑定版本。
页:
[1]