JS(三)
2017-07-12 21:07
78 查看
函数: body:
分别赋值输出,再一起输出
function forin() { <input type="button" onclick="forin()" value="forin"/>
var person={fname:"张",lname:"三",age:"66"};
var cc="";
for(i in person){
cc=cc+person[i];
alert(cc);
}
}
函数:body:
function test1() {
<input type="button" onclick="test1()" value="1"/>
shuzu=["1","2","3","33"];
var i=0;
for(;shuzu[i];){
document.write(shuzu[i]+"<br>")
i++;
}
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
通过标签找到对象 ,原理同id相同。
function test2() { <input type="button" onclick="test2()" value="2"/>
var a=document.getElementsByTagName("p");
alert(a.length);
for(var i=0;i<a.length;i++){
alert(a[i].id);
}
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
通过id找到次标签内部的某个标签
function test3() {
<div id="A"> <p id="a"></p><p id="b"></p> </div>
var b=document.getElementById("A")
var a=b.getElementsByTagName("p");
alert(a.length);
for(var i=0;i<a.length;i++){
alert(a[i].id);
}
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
JQ通过ID查找value并输出值
function test4() {//JQ写; <input id="aa" type="button" onclick="test4()" value="4"/>
var a=$("#aa").val();
alert(a);
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
匿名函数另一种写法
document.getElementById("cc").onclick=function(){dayte()} <input id="cc" type="button" onclick="test6()" value="6"/>
function dayte() {
alert("qq");
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
鼠标放上去、离开产生效果
function over(obj) {
<div id="mouse1" onmouseover="over(this)" onmouseout="out(this)" onmousedown="down()"onmouseup="up()">离开</div>
obj.innerHTML="放在上面"
}
function out(obj) {
obj.innerHTML="离开"
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
点击、松开进行图片改变:
//松开
<div id="mouse2" onmousedown="down()"onmouseup="up()">此处放图片文字等内容</div>
function up() {
var up=document.getElementById("mouse2");
up.innerHTML="<img src='image/1499480434.jpg' style='width:200px;height:200px'></img>";
}
//点下
function down() {
var down=document.getElementById("mouse2");
down.innerHTML="<img src='image/1499488740.jpg' style='width:200px;height:200px'></img>";
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
得到与失去焦点:
function get() { <input id="get"type="text" onfocus="get()" onblur="lost()">
var get=document.getElementById("get");
alert("获得焦点")
}
function lost() {
var get=document.g
4000
etElementById("lost");
alert("失去焦点")
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数:
创建与删除节点:
// <!--创建新节点-->
function create() {
var newh=document.getElementById("add");
var h2=document.createElement("h2");
h2.innerHTML="新创的节点"
newh.appendChild(h2);
}
//<!--删除节点-->
function delecte() {
var father=document.getElementById("select");
var child=document.getElementById("child");
father.removeChild(child);
}
body:
<div id="add">
<input type="button" value="创建" onclick="create()">
<h1>旧的节点</h1>
<br>
</div>
<div id="select">
<input type="button" value="删除" onclick="delecte()">
<h1 id="child">老的节点</h1>
<br>
</div>
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
打开、关闭窗口:
//打开
<input type="button" value="打开" onclick="open()"/>
<input type="button" value="关闭" onclick="close()"/>
function open() {
window.open();
}
//关闭
function close() {
window.close();
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数:
1.从输出框中得到value并在地址栏中将其输出
2.从输出栏中得到Value并通过浏览器搜索内容
function username() {
var username=document.getElementById("username").value;
location.href="http://www.baidu.com?username="+username;
}
function sousuo() {
var username=document.getElementById("sousuo").value;
location.href="http://前后两边为随意地址只需将value所对应值修改即可;
}
body:
用户名:<input type="text" id="username"/>
<input type="button" onclick="username()">
搜索: <input type="text" id="soushuo">
<input type="button" onclick="suosuo()">
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数:
历史history,前进,后退,跳到某一个历史记录站点
function back(){
//返回
window.history.back();
}
//前进
function forward(){
window.history.forward();
}
//进入某个历史站点
function go(){
window.history.forward();
} '
body:
input type="button" onclick="back()" value="后退">
<input type="button" onclick="forward()" value="前进">
<input type="button" onclick="go()" value="go">
分别赋值输出,再一起输出
function forin() { <input type="button" onclick="forin()" value="forin"/>
var person={fname:"张",lname:"三",age:"66"};
var cc="";
for(i in person){
cc=cc+person[i];
alert(cc);
}
}
函数:body:
function test1() {
<input type="button" onclick="test1()" value="1"/>
shuzu=["1","2","3","33"];
var i=0;
for(;shuzu[i];){
document.write(shuzu[i]+"<br>")
i++;
}
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
通过标签找到对象 ,原理同id相同。
function test2() { <input type="button" onclick="test2()" value="2"/>
var a=document.getElementsByTagName("p");
alert(a.length);
for(var i=0;i<a.length;i++){
alert(a[i].id);
}
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
通过id找到次标签内部的某个标签
function test3() {
<div id="A"> <p id="a"></p><p id="b"></p> </div>
var b=document.getElementById("A")
var a=b.getElementsByTagName("p");
alert(a.length);
for(var i=0;i<a.length;i++){
alert(a[i].id);
}
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
JQ通过ID查找value并输出值
function test4() {//JQ写; <input id="aa" type="button" onclick="test4()" value="4"/>
var a=$("#aa").val();
alert(a);
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
匿名函数另一种写法
document.getElementById("cc").onclick=function(){dayte()} <input id="cc" type="button" onclick="test6()" value="6"/>
function dayte() {
alert("qq");
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
鼠标放上去、离开产生效果
function over(obj) {
<div id="mouse1" onmouseover="over(this)" onmouseout="out(this)" onmousedown="down()"onmouseup="up()">离开</div>
obj.innerHTML="放在上面"
}
function out(obj) {
obj.innerHTML="离开"
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
点击、松开进行图片改变:
//松开
<div id="mouse2" onmousedown="down()"onmouseup="up()">此处放图片文字等内容</div>
function up() {
var up=document.getElementById("mouse2");
up.innerHTML="<img src='image/1499480434.jpg' style='width:200px;height:200px'></img>";
}
//点下
function down() {
var down=document.getElementById("mouse2");
down.innerHTML="<img src='image/1499488740.jpg' style='width:200px;height:200px'></img>";
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
得到与失去焦点:
function get() { <input id="get"type="text" onfocus="get()" onblur="lost()">
var get=document.getElementById("get");
alert("获得焦点")
}
function lost() {
var get=document.g
4000
etElementById("lost");
alert("失去焦点")
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数:
创建与删除节点:
// <!--创建新节点-->
function create() {
var newh=document.getElementById("add");
var h2=document.createElement("h2");
h2.innerHTML="新创的节点"
newh.appendChild(h2);
}
//<!--删除节点-->
function delecte() {
var father=document.getElementById("select");
var child=document.getElementById("child");
father.removeChild(child);
}
body:
<div id="add">
<input type="button" value="创建" onclick="create()">
<h1>旧的节点</h1>
<br>
</div>
<div id="select">
<input type="button" value="删除" onclick="delecte()">
<h1 id="child">老的节点</h1>
<br>
</div>
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数: body:
打开、关闭窗口:
//打开
<input type="button" value="打开" onclick="open()"/>
<input type="button" value="关闭" onclick="close()"/>
function open() {
window.open();
}
//关闭
function close() {
window.close();
}
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数:
1.从输出框中得到value并在地址栏中将其输出
2.从输出栏中得到Value并通过浏览器搜索内容
function username() {
var username=document.getElementById("username").value;
location.href="http://www.baidu.com?username="+username;
}
function sousuo() {
var username=document.getElementById("sousuo").value;
location.href="http://前后两边为随意地址只需将value所对应值修改即可;
}
body:
用户名:<input type="text" id="username"/>
<input type="button" onclick="username()">
搜索: <input type="text" id="soushuo">
<input type="button" onclick="suosuo()">
----------------------------------------------------------------------------------------------------------------------------------------------------------
函数:
历史history,前进,后退,跳到某一个历史记录站点
function back(){
//返回
window.history.back();
}
//前进
function forward(){
window.history.forward();
}
//进入某个历史站点
function go(){
window.history.forward();
} '
body:
input type="button" onclick="back()" value="后退">
<input type="button" onclick="forward()" value="前进">
<input type="button" onclick="go()" value="go">
相关文章推荐
- XML + XSL + JS 构建小型Web App (十四)
- Node.js(day5)
- 给初学者提供几本学习js值得看的书
- XML + XSL + JS 构建小型Web App (十三)
- XML + XSL + JS 构建小型Web App (十)
- XML + XSL + JS 构建小型Web App (十一)
- XML + XSL + JS 构建小型Web App (十二)
- XML + XSL + JS 构建小型Web App (八)
- XML + XSL + JS 构建小型Web App (九)
- XML + XSL + JS 构建小型Web App (二)
- XML + XSL + JS 构建小型Web App (三)
- XML + XSL + JS 构建小型Web App (四)
- XML + XSL + JS 构建小型Web App (五)
- XML + XSL + JS 构建小型Web App (六)
- XML + XSL + JS 构建小型Web App (七)
- XML + XSL + JS 构建小型Web App (一)
- ASP+JS时的"""
- XML + XSL + JS 构建小型Web App (十五)
- 真正的 用JS 做的 loading
- JS版常见问题(二)兼容版本的无提示关闭窗口!