javascript应用2

java风

浏览: 57572 次
来自: 北京

最近访客更多访客>>

bdpy9864

bemchou89

CRH2016

cqdtb

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

java

javascript

日期插件的应用：{

</head>

<body>

<hr>

</body>

}

表单的三种提交方式：{

function testButton(){

var email = document.getElementById("email").value;

var pwd = document.getElementById("pwd").value;

var flag = true;

if(email == ""){

flag = false;

document.getElementById("emailError").innerHTML = "请填写邮箱";

}

if(pwd == ""){

flag = false;

document.getElementById("pwdError").innerHTML = "请填写密码";

}

if(flag){

document.loginForm.submit();

}

function checkAll(){

var email = document.getElementById("email").value;

var pwd = document.getElementById("pwd").value;

var flag = true;

if(email == ""){

flag = false;

document.getElementById("emailError").innerHTML = "请填写邮箱";

}

if(pwd == ""){

flag = false;

document.getElementById("pwdError").innerHTML = "请填写密码";

}

return flag;

}

</script>

</head>

<body>

邮箱 :

密码 :

</form>

</body>

}

获取结点的方式：{

* 直接获取节点的三种方式

* 1.通过元素(节点)id属性来获取即document.getElementById() 通用方式

* 2.通过元素(节点)name属性值来获取name属性值相同的节点组成的集合注意：并不是所有的节点都有name属性

* 3.通过元素(节点)的标签名称来获取该标签的所有节点组成的集合

function testMethod(){

var div = document.getElementsByTagName("div")[0];

alert(div.innerHTML);

}

function testChildMethod(){

var form = document.getElementById("firstForm");

var strs = form.childNodes;//得到form表单的子节点注意和elements的属性区别

/*for ( var i = 0; i < strs.length; i++) {

alert(strs[i].nodeName + "----" + strs[i].nodeValue);

}*/

var first = form.firstChild;//第一个子节点可以直接获取

var last = form.lastChild;//最后一个子节点也可以直接获取

* nodeName属性如果是文本节点返回的#text 如果是元素节点返回的是标签的名称

* nodeValue属性如果是文本节点返回的是文本的内容如果是元素节点返回的是null

//alert(first.nodeName + "---" +first.nodeValue);

//alert(last.nodeName + "---" +last.nodeValue);

//var body = form.parentNode;//可以得到父节点

//alert(body.nodeName);

var email = document.getElementById("email");

var next = email.nextSibling;//下一个节点

var prev = email.previousSibling;//上一个节点

alert(next.nodeName + " --next-- " + next.nodeValue);

alert(prev.nodeName + " --prev-- " + prev.nodeValue);

}

</script>

</head>

<body>

邮箱 :

密码 :

<hr>

<div>

今天是星期五生病的同学赶紧趁着周末养好病

</div>

<hr>

</body>

}

子节点的操作：{

function testAppendChild(){

/*var input = document.createElement("input");//<input/>

input.type = "text";//<input type='text'/>

input.name = "email";//<input type='text' name='email'/>

input.value = "lishimin@126.com";//<input type='text' name='email' value='lishimin@126.com'/>

var div = document.createElement("div");

div.id = "fifth";

div.align = "center";

div.style.color = "blue";

div.style.fontSize = "50px";

div.innerHTML = "代沟绝对是代沟";

var parent = document.getElementById("first").parentNode;//得到父节点

parent.appendChild(div);//通过父节点添加子节点

}

function testInsertBefore(){

var div = document.createElement("div");

div.id = "fifth";

div.align = "center";

div.style.color = "green";

div.style.fontSize = "50px";

div.innerHTML = "跳跃性的思维是值得鼓励的但是要有一定的限制";

var third = document.getElementById("third");

third.parentNode.insertBefore(div, third);

}

function testReplaceChild(){

var div = document.createElement("div");

div.id = "fifth";

div.style.color = "orange";

div.style.fontSize = "50px";

div.innerHTML = "神马都是浮云";

var fourth = document.getElementById("fourth");

fourth.parentNode.replaceChild(div, fourth);

}

function testRemoveChild(){

var fourth = document.getElementById("fourth");

fourth.parentNode.removeChild(fourth);

}

</script>

</head>

<body>

大家好才是真的好

</div>

一切皆有可能

</div>

我选择我喜欢

</div>

飞一般的感觉

</div>

<hr>

</body>

}

Div的隐藏展开、刷新当前页面：{

* 确定删除后链接到百度

function deleteNews(){

if(confirm("删除后不能恢复,确认删除?")){

window.location.href = "http://www.baidu.com";//就相当于html中的点击超链接直接跳转

}

function testMethod(){

document.getElementById("first").style.display = "block";

//alert(location);

}

function firstMethod(){

window.location.reload();//刷新当前页面

}

</script>

</head>

<body>

<hr>

姚明退役了但是影响力依然存在

</div>

<hr/>

</body>

}

分享到：

javascript应用3 | javascript应用1

2011-09-10 15:09
浏览 898
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论