hi,这里是X，最近在学习JavaScript，所以最近没有意外的话会带来很多有关JavaScript的任务或者作品，有大有小，欢迎进来学习和评论。😎😎😎
在对输入的文字设置背景颜色，这当然只是一个影子，大家学会了想怎么变都可以，然后直接上代码
<!doctype html>
<html>
<head>
<meta charset = "utf-8">
<title>使用split()和join()实现对输入文字设置背景颜色</title>
<script>
window.onload = function(){
var oDiv = document.getElementById('div1');
var aInp = document.getElementsByTagName('input');
var arrColor = ['#FFC','#CC3','#6FC','#9C9','#C6F','#CFF'];
var arrFont = ['SimSun','STKaiti','NSimSun'];//中文字体
aInp[1].onclick = function(){
var str = aInp[0].value;
var arr = str.split('');//将字符串使用空字符串分隔为字符串数组
for(var i = 0; i < arr.length; i++){
arr[i] = '<span style="background:'+arrColor[i%arrColor.length]+';">'+arr[i]+'</span>';
}
oDiv.innerHTML = arr.join('');//将数组各个元素使用空字符串连接成字符串
aInp[0].value = '';//清空文本框中输入的文本内容
};
};
</script>
<body>
<div id="div1" style="width:300px;height:50px;"></div>
<input type="text"/>
<input type="button" value="提交"/>
</body>
</html>
9660
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
