JS九九乘法表
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
table{
width:800px;
border-collapse:collapse;
border:1px solid blue;
text-align:center;
}
tr,td{
border:1px solid blue;
padding:5px;
}
</style>
</head>
<body>
<script>
document.write("<table>");
for(var i=1; i<=9; i++){
document.write("<tr>");
for(var j=1; j<=i; j++){
document.write("<td>");
document.write(j+"*"+i+"="+j*i);
document.write("</td>");
}
document.write("</tr>");
}
document.write("</table>");
</script>
</body>
</html>
JS冒泡排序法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>排序</title>
</head>
<script type="text/javascript">
function m(arr){
var temp;
for(var i=0;i<arr.length;i++){
for(var j=i+1;j<arr.length;j++){
if(arr[j]>arr[i]){
temp=arr[j];
arr[j]=arr[i];
arr[i]=temp;
}
}
};
return arr;
}
var array=[85,33,63,17,31,17,86];
var s=m(array);
document.write(s);
</script>
<body>
</body>
</html>
JS百度搜索框联想词提示代码
<!DOCTYPE html>
<!--suppress ALL -->
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JS百度搜索框联想词提示代码 </title>
<!--这里为了简写,就直接在HTML中写了-->
<style>
*{
margin: 0;
padding: 0;
}
#out{
width:500px;
height:140px;
margin: 160px 350px;
}
#ser_box{
width:500px;
height:32px;
border: 1px solid blue;
text-align: center;
}
#ipt{
width:480px;
height: 26px;
margin-top: 2px;
border: 0;
outline: 0;
font-family: "微软雅黑";
font-size: 16px;
}
#bot_box{
width:500px;
border: 1px solid #4C9ED9;
border-top: none;
display: none;
}
#bot_box ul li{
list-style: none;
line-height: 25px;
padding-left: 10px;
}
#bot_box ul li:hover{
background: #BCBCBC;
}
.s_btn {
position:relative;
left:300px;
top:-31px;
width: 100px;
height: 36px;
color: #fff;
font-size: 15px;
letter-spacing: 1px;
background: #3385ff;
border-bottom: 1px solid #2d78f4;
outline: medium;
}
.sel{
background:#BCBCBC;
}
</style>
</head>
<body>
<div id="out">
<div id="ser_box">
<input type="search" id="ipt"/><span><input id="su" value="搜索一下" class="bg s_btn" type="submit"></span>
</div>
<div id="bot_box">
<ul id="oul"></ul>
</div>
</div>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器:360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p>
<p>来源:<a href="http://sc.chinaz.com/" target="_blank">站长素材</a></p>
</div>
<script>
function $(id) {
return document.getElementById(id);
}
var ipt = $("ipt");
var ser = $("ser_box");
var bot = $("bot_box");
var oul = $("oul");
ipt.oninput = function() {
var ss = ipt.value;
var url = "http://suggestion.baidu.com/su?cb=queryList&wd=" + ss;
addScript(url);
}
ipt.onfocus = function() {
var ss = ipt.value;
var url = "http://suggestion.baidu.com/su?cb=queryList&wd=" + ss;
addScript(url);
}
function queryList(data) {
ss=document.getElementsByTagName("script")[0];
var arr = data.s;
oul.innerHTML = "";
if(arr.length == 0) {
bot.style.display = "none";
} else {
bot.style.display = "block";
}
for(var i = 0; i < arr.length; i++) {
li = document.createElement("li");
li.innerHTML = arr[i];
li.onclick = function() {
oul.innerHTML = "";
ipt.value = this.innerHTML;
bot.style.display = "none";
}
oul.appendChild(li);
}
document.body.removeChild(ss);
}
function addScript(url) {
var s = document.createElement("script");
s.src = url;
s.type = "text/javascript";
document.body.appendChild(s);
}
/*取li*/
lis = document.getElementsByTagName("li");
/*按键*/
var i = 0;
document.onkeydown = function(ev) {
if(bot.style.display == "block") {
// 40是按下键
if(ev.keyCode == 40) {
for(var j = 0; j < lis.length; j++) {
if(lis[j].className == "sel") {
lis[j].className = "";
}
}
if(i < lis.length) {
lis[i].className = "sel";
i++;
if(i == lis.length) {
i = 0;
}
}
}
// 38是按上键
if(ev.keyCode == 38) {
m = 0
for(; m < lis.length; m++) {
if(lis[m].className == "sel") {
lis[m].className = "";
break;
}
}
i = m;
if(m > 0) {
lis[m - 1].className = "sel";
} else {
lis[lis.length - 1].className = "sel";
}
}
// 13是按enter键
if(ev.keyCode == 13) {
for(var n = 0; n < lis.length; n++) {
if(lis[n].className == "sel") {
ipt.value = lis[n].innerHTML;
}
}
bot.style.display = "none";
}
} else {
i = 0;
m = 0;
}
}
</script>
</body>
</html>