//逗比小憨憨
//举例：
var a = 10;
document.write(a);//在页面输出一个内容
//举例：
var a = 10;
var str = "逗比小憨憨";
document.write(str + a, typeof(str + a));
//举例：
document.write("Number(\"123\"):" +Number("123") + "<br/>");
document.write(parseInt("+123.456px"));//第一个字符为+或-也进行转换，从左往右取整数
document.write(parseFloat("123.456px"));
var num = 123;
document.write(num.toString());
//举例：计算1+2+3+...+100
var n = 1, sum = 0;
while(n <= 100)
{
sum += n;
n++;
}
document.write(sum);
//找出100-1000中的水仙花数
var str1 = "";
for(var i = 100; i < 1000; i++)
{
var a = i / 100; //取百位上的数字
a = parseInt(a);
var b = i % 100 / 10; //取十位上的数字
b = parseInt(b);
var c = i % 10; //取个位上的数字
c = parseInt(c);
if(i == (a * a * a + b * b * b + c*c*c))
{
str1 = str1 + i + "、";
}
}
document.write("水仙花数有：" + str1);
//判断一个数是不是整数
window.onload = function()
{
var n = 3.14159;
if(parseInt(n) == parseFloat(n))
{
document.write(n + "是整数");
}
else
{
document.write(n + "不是整数");
}
}
//举例：
function add_sum(e, f){
var sum = e + f;
document.write(sum);
}
add_sum(10, 20);
function test(){alert("doubi");}//供超链接调用测试的函数
//举例
var str = "This is doubixiaohanhan";
document.write("字符串长度为：" + str.length);//空格也计算在内
document.write("转为大写字母:" + str.toUpperCase());
document.write("转为小写字母:" + str.toLowerCase());
document.write("获取第3个字符: " + str.charAt(3));//字符串下标从0开始计算
document.write(str.substring(8, 23));
document.write(str.replace("doubixiaohanhan", "hahahahahaha"));
var str1 = str.split(" ");//以空格作为分隔符
for(var i = 0; i < 3; i++)
document.write(str1[i]);
document.write(str.indexOf("bi"));
document.write(str.lastIndexOf("han"));
//找出字符串中所有字符b,不区分大小写
var n = 0,str1 = "doubixiaohanhan";
document.write("源字符串:" + str1);
for(var j = 0; j < str1.length; j++)
{
var char = str1.charAt(j);
if('h' == char.toLowerCase())
{
document.write(char);
n = n + 1;
}
}
document.write("字符串中有" + n + "个字符h");
//统计字符串中数字的个数
function get_number(str){
var num = 0, i = 0;
while(i < str.length){
var char = str.charAt(i);
if((char != " ") && (!isNaN(char))){//isNaN:不是数字则返回true
num++;
}
i++;
}
alert("执行完毕");
return num;
}
var ret = get_number("dou120k53KDDD6656");
document.write(ret);
//举例
var arr = ["js","jquery"];
document.write(arr + '\n');
arr.unshift("db");
arr.push("ab");
document.write(arr);
arr.shift();
arr.pop();
document.write(arr);
var arr1 = [3, 6, 2, 5, 8, 1];
document.write(arr1);
function up(a,b){return a-b;}
arr1.sort(up);
document.write(arr1);
function down(a,b){return b-a}
arr1.sort(down);
document.write(arr1);
var arr = ["js","jquery","abcd"];
var re = arr.join("");
document.write(re);
document.write(typeof(re));
//例题：将字符串所有字符颠倒顺序
function test(str){
var arr = str.split("");
document.write(typeof(arr));
arr.reverse();
var re = arr.join("");
document.write(typeof(re));
return re;
}
document.write("javascript颠倒后： " + test("javascript"));
//举例
var d = new Date();
var myyear = d.getFullYear();
var mymonth = d.getMonth();
var myday = d.getDate();
var myday1 = d.getDay();
var weekend = ["星期天","星期一","星期二","星期三","星期四","星期五","星期六"];
document.write(myyear + "年"+(mymonth+1)+"月"+myday+"日"+weekend[myday1]);
//举例
var a = Math.max(3,9,10,2,4,6,12,67,9);
document.write(a);
var b = 0.6;
document.write(Math.floor(b));//floor向下取整
document.write(Math.ceil(b)); //ceil向上取整
document.write(Math.random()*10);
//例题：生成随机验证码
function random_validate(str){
var arr = str.split("");
var result = "";
for(var i = 0;i < 4; i++){
var n = Math.floor(Math.random()*arr.length);
result += arr[n];
}
return result;
}
document.write(random_validate("asjcbakavbavakvhakjbvkvJASSDKABKAVAVJ24123435"));
//创建简单元素
window.onload =function(){
var oDiv = document.getElementById("content");
var oStrong = document.createElement("strong");
var oTxt = document.createTextNode("逗比小憨憨");
oStrong.appendChild(oTxt);
oDiv.appendChild(oStrong);
}
//创建带属性的元素
window.onload =function(){
var oInput = document.createElement("input");
oInput.id = "sumit";
oInput.type = "button";
oInput.value = "提交";
document.body.appendChild(oInput);
}
//创建动态图片
window.onload =function(){
var oImg = document.createElement("img");
oImg.className = "doubi";
oImg.src = "img/doubi.jpg";
oImg.style.border = "1px solid silver";
document.body.appendChild(oImg);
}
//创建多个元素
window.onload =function(){
var oTable = document.createElement("table");
for(var i = 0; i < 3;i++){
var oTr = document.createElement("tr");
for(var j = 0; j < 3; j++){
var oTd = document.createElement("td");
oTr.appendChild(oTd);
}
oTable.appendChild(oTr);
}
document.body.appendChild(oTable);
}
//子元素插到末尾
window.onload =function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
var oU1 = document.getElementById("list");
var oTxt = document.getElementById("txt");
var textNode = document.createTextNode(oTxt.value);
var oLi = document.createElement("li");
oLi.appendChild(textNode);
oU1.appendChild(oLi);
}
}
//子元素插到某个子元素之前
window.onload =function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
var oU1 = document.getElementById("list");
var oTxt = document.getElementById("txt");
var textNode = document.createTextNode(oTxt.value);
var oLi = document.createElement("li");
oLi.appendChild(textNode);
oU1.insertBefore(oLi, oU1.firstElementChild);
}
}
//删除子元素
window.onload =function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
var oU1 = document.getElementById("list");
oU1.removeChild(oU1.lastElementChild);
}
}
//复制元素
window.onload =function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
var oU1 = document.getElementById("list");
document.body.appendChild(oU1.cloneNode(1));
}
}
//替换元素
window.onload =function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
var oFirst = document.querySelector("body *:first-child");
var oTag = document.getElementById("tag");
var oTxt = document.getElementById("txt");
var onewTag = document.createElement(oTag.value);
var onewTxt = document.createTextNode(oTxt.value);
oNewTag.appendChild(oNewTxt);
document.body.replaceChild(oNewTag, oFirst);
}
}
//获取静态HTML中的属性值
window.onload = function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
alert(oBtn.id);
}
}
//获取动态HTML中的属性值
window.onload = function(){
var oInput = document.createElement("input");
oInput.id = "submit";
oInput.type = "button";
oInput.value = "提交";
document.body.appendChild(oInput);
oInput.onclick = function(){
alert(oInput.id);
}
}
//获取单行文本框的值
window.onload = function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
var oTxt = document.getElementById("txt");
alert(oTxt.value);
//document.write(oTxt.value);
}
}
//获取单选框的值
window.onload = function(){
var oBtn = document.getElementById("btn");
var oFruit = document.getElementsByName("fruit");
oBtn.onclick = function(){
for(var i = 0; i < oFruit.length; i++){
if(oFruit[i].checked){
alert(oFruit[i].value);
}
}
}
}
//获取复选框的值
window.onload = function(){
var oBtn = document.getElementById("btn");
var oFruit = document.getElementsByName("fruit");
var str = "";
oBtn.onclick = function(){
for(var i = 0; i < oFruit.length; i++){
if(oFruit[i].checked){
str +=oFruit[i].value;
}
}
alert(str);
}
}
//获取下拉列表的值
window.onload = function(){
var oBtn = document.getElementById("btn");
var oSelect = document.getElementById("select");
oBtn.onclick = function(){
alert(oSelect.value);
}
}
//设置属性值
window.onload = function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
oBtn.value = "button";
document.write(oBtn.value);
}
}
//获取固有属性值
window.onload = function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
alert(oBtn.getAttribute("id"));
}
}
//获取自定义属性值
window.onload = function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
//alert(oBtn.data);//oBtn.data是不能获取自定义属性值
alert(oBtn.getAttribute("data"));
}
}
//获取自定义属性值
window.onload = function(){
var oTd = document.getElementsByTagName("td");
for(var i = 0;i < oTd.length; i++){
oTd[i].onclick = function(){
var oParent = this.parentNode;
oParent.style.color = "white";
oParent.style.backgroundColor = "red";
};
}
}
//childNodes与children的比较
window.onload = function(){
var oU1 = document.getElementById("list");
var childNodes = oU1.childNodes.length;
var children = oU1.children.length;
alert("childNodes的长度："+childNodes + "\n" +"children的长度："+children);
}
//鼠标移入移出
window.onload = function(){
var oP = document.getElementById("content");
oP.onmouseover = function(){
this.style.color = "red";
}
oP.onmouseout = function(){
this.style.color = "yellow";
}
}
//鼠标按下松开
window.onload = function(){
var oDiv = document.getElementById("title");
var oBtn = document.getElementById("btn");
oBtn.onmousedown = function(){
oDiv.style.color = "red";
}
oBtn.onmouseup = function(){
oDiv.style.color = "blue";
}
oBtn.onmousemove = function(){
oDiv.style.color = "green";
}
}
//统计输入字符的长度（键盘按下松开实验）
window.onload = function(){
var oTxt = document.getElementById("txt");
var onum = document.getElementById("num");
oTxt.onkeyup = function(){
var str = oTxt.value;
oNum.innerHTML = str.length;
}
}
//统计输入字符的长度（键盘按下松开实验）
window.onload = function(){
var oTxt = document.getElementById("txt");
var oDiv = document.getElementById("content");
var myregex = /^[0-9]*$/;
oTxt.onkeyup = function(){
if(myregex.test(oTxt.value)){
oDiv.innerHTML = "输入正确";
}
else{
oDiv.innerHTML = "必续输入数字";
}
}
}
//搜索框（焦点的应用）
window.onload = function(){
var oSearch = document.getElementById("search");
oSearch.onfocus = function(){
if(this.value == "逗比小憨憨"){
this.value = "";
}
};
oSearch.onblur = function(){
if(this.value == ""){
this.value = "逗比小憨憨";
}
};
}
//focus方法:onfocus是一个属性
window.onload = function(){
var oTxt = document.getElementById("txt");
oTxt.focus();
}
//onselect事件
window.onload = function(){
var oTxt1 = document.getElementById("txt1");
var oTxt2 = document.getElementById("txt2");
oTxt1.onselect = function(){
alert("你选中了单行文本框中的内容");
}
oTxt2.onselect = function(){
alert("你选中了多行文本框中的内容");
}
}
//select方法：当使用搜索框时，每次点击搜索框，它就会帮我们自动选中文本框中的所有内容
window.onload = function(){
var oSearch = document.getElementById("search");
oSearch.onclick = function(){
this.select();
};
}
//onchange事件用于单选框
window.onload = function(){
var oFruit = document.getElementsByName("fruit");
var oP = document.getElementById("content");
for(var i = 0;i < oFruit.length; i++){
oFruit[i].onchange = function(){
if(this.checked){
oP.innerHTML = "你选择的是: "+this.value;
}
}
};
}
//onchange事件用于复选框
window.onload = function(){
var oFruit = document.getElementsByName("fruit");
var oSel = document.getElementById("sel");
for(var i = 0; i < oFruit.length; i++)
alert(oFruit[i].value);
oSel.onchange = function(){
if(this.checked){
for(var i = 0; i < oFruit.length; i++){
oFruit[i].checked = true;
}
}
else{
for(var i = 0; i < oFruit.length; i++){
oFruit[i].checked = false;
}
}
};
}
//onchange事件用于下拉列表
//选择下拉列表的某一选项时，触发的是onchange事件，而不是onselect事件；
onselect事件仅仅当选择文本框中内容时才会触发
window.onload = function(){
var oList = document.getElementById("list");
oList.onchange = function(){
var link = this.options[this.selectedIndex].value;
window.open(link);
};
}
//oncopy事件的应用
window.onload = function(){
document.body.oncopy =function(){
return false;
}
}
//onselectstart事件的应用
window.onload = function(){
document.body.onselectstart =function(){
return false;
}
}
//oncontexmenu事件的应用
window.onload = function(){
document.body.oncontextmenu =function(){
return false;
}
}
//onload,onbeforeunload事件的应用
window.onload = function(){
alert("doubi");
}
window.onbeforeunload = function(e){
e.returnValue = "你准备离开页面";
}
//例题
window.onload = function(){
var oBtn = document.getElementById("btn");
oBtn.addEventListener("click", alterMes, false);
function alterMes(){
alert("javascript");
}
}
//上述等价于下面程序
window.onload = function(){
var oBtn = document.getElementById("btn");
oBtn.addEventListener("click", function(){
alert("javascript");}, false);
}
//获取事件的类型
window.onload = function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(e){//e是一个变量名存储一个event对象
//实际上每次调用一个事件的时候，js都会默认给这个事件函数加上一个隐藏的参数
//这个参数就是event对象，一般来说，event事件是作为事件函数的第一个参数传入
alert(e.type);
}
}
//禁止shift，alt,ctrl键
window.onload = function(){
document.onkeydown = function(e){
if(e.shiftKey || e.altKey || e.ctrlKey){
alert("禁止使用shift，alt,ctrl键")
}
}
}
//获取上下左右方向键
window.onload = function(){
var oSpan = document.getElementsByTagName("span")[0];
window.addEventListener("keydown",doubi,false);
function doubi(e){
switch(e.keyCode)
{
case 38:
case 87:oSpan.innerHTML = "上";break;
case 39:
case 68:oSpan.innerHTML = "右";break;
case 40:
case 83:oSpan.innerHTML = "下";break;
case 65:
case 37:oSpan.innerHTML = "左";break;
default:oSpan.innerHTML = "";break;
}
}
}
//举例
window.onload = function(){
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
window.open("http://www.baidu.com","_blank");//在新窗口打开
window.open("http://www.baidu.com","_self");//在当前窗口打开
}
}
//操作空白窗口中的元素
window.onload = function(){
var oBtn = document.getElementsByTagName("input");
var opener = null;
oBtn[0].onclick = function(){
opener = window.open();
var strHtml = '<!DOCTYPE html>\
<html>\
<head>\
<title></title>\
</head>\
<body>\
<div>逗比小憨憨</div>\
</body>\
</html>';
opener.document.write(strHtml);
};
oBtn[1].onclick = function(){
var oDiv = opener.document.getElementsByTagName("div")[0];
oDiv.style.fontWeight = "bold";
oDiv.style.color = "hotpink";
};
}
///confirm/i对话框的使用
window.onload = function(){
var oBtn = document.getElementById("btn1");
oBtn.onclick = function(){
if(confirm("确定要跳转到首页吗?")){
window.location.href = "http://www.baidu.com";
}else{
document.write("取消");
}
};
}
//prompt对话框的使用
window.onload = function(){
var oBtn = document.getElementById("btn1");
oBtn.onclick = function(){
var name = window.prompt("请输入您的名字:");
document.write("欢迎来到<strong>"+name+"</strong>");
};
}
//setTimeout()的使用
window.onload = function(){
setTimeout('alert("doubi")', 2000);
}
//setTimeout()的使用,其中code是一个函数
window.onload = function(){
setTimeout('alert("doubi")', 2000);
}
////setTimeout()的使用,其中code是一个函数名
window.onload = function(){
setTimeout(alertMes, 2000);
function alertMes(){
alert("doubixiaohanhan");
}
}
//clearTimeout()的使用
window.onload = function(){
var oBtn = document.getElementsByTagName("input");
var timer = null;
oBtn[0].onclick = function(){
//alert("你已点击开始定时按钮");
timer = setTimeout(alertMes, 5000);
function alertMes(){
alert("doubixiaohanhan");
}
};
oBtn[1].onclick = function(){
clearTimeout(timer);
}
}
//setInterval()的使用
var n = 10;
window.onload = function(){
var t = setInterval(countdown,1000);
};
function countdown(){
if(n > 0){
n--;
document.getElementById("num").innerHTML = n;
}
}
//setInterval()的使用,在图片轮播开发中特别有用
window.onload = function(){
var oBtn = document.getElementsByTagName("input");
var oDiv = document.getElementsByTagName("div")[0];
var colors = ["red","yellow","blue","green","purple","orange"];
var time = null;
var i = 0;
oBtn[0].onclick = function(){
clearTimeout(time);
time = setInterval(function(){
oDiv.style.backgroundColor = colors[i];
i++;
i = i%colors.length;
},1000);
};
oBtn[1].onclick = function(){
clearInterval(time);
};
}
//href的使用
window.onload = function(){
var url = window.location.href;
document.write("当前页面地址："+ url);
window.setTimeout(code,3000);
function code(){
url = window.location.href = "http://www.baidu.com";
window.open(url);
};
}
//navigator的使用
window.onload = function(){
//indexOf(用于查找某个字符串在字符串中首次出现的位置，如果找不到返回-1)
if(window.navigator.userAgent.indexOf("MSIE") != -1){
alert("这是IE浏览器");
}
else if(window.navigator.userAgent.indexOf("Chrome") != -1){
alert("这是谷歌浏览器");
}
else if(window.navigator.userAgent.indexOf("Firefox") != -1){
alert("这是火狐浏览器");
}
else;
}
//获取url
window.onload = function(){
var url = document.URL;
document.write(url);
}
//输出内容并换行
window.onload = function(){
var url = document.URL;
document.writeln(url);
document.writeln("doubixiaohanhan");
}
