zoukankan      html  css  js  c++  java
  • JavaScript-14(操纵属性和window)

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title>用JS操纵属性和window</title>
    		<style type="text/css">
    			.tiaozhuan{
    				 50px;
    				height: 20px;
    				border-radius: 5px;
    				background-color: orange;
    				color: white;
    				text-align: center;
    				line-height: 20px;
    				margin-top: 12px;
    			}
    		</style>
    	</head>
    	<body>
    		<!--创造一个图片,然后用js实现点击它更换引用路径-->
    		<img src="../img/fengjing.jpg" width="300px"height="170px" onclick="ghlj()"/>
    		<!--点击下面的跳转,通过函数运用window.location.href命令将窗口跳转到指定路径-->
    		<div class="tiaozhuan" onclick="tiaozhuan1()">
    			跳转
    		</div>
    		<!--点击下面的刷新,通过函数运用window.location.reload()命令将窗口刷新-->
    		<div class="tiaozhuan" onclick="shuaxin()">
    			刷新
    		</div>
    		<!--点击下面的向后翻页,通过函数运用window.history.go(1)命令将窗口向后翻,如果将()中改为-1,则向前翻页-->
    		<div class="tiaozhuan" onclick="xh()">
    			向后翻页
    		</div>
    		
    	</body>
    </html>
    
    <script type="text/javascript">
    	//用tupian这个变量接收img标签的集合
    	var tupian = document.getElementsByTagName("img");
    	//运用getAttribute获得这个图片的src属性值;运用setattribute命令把这个图片的“src”属性设为想要改变的图片路径
    	function ghlj(){
    		alert(tupian[0].getAttribute("src"));
    		tupian[0].setAttribute("src","../img/aiji.jpg");
    	}
    	function tiaozhuan1(){
    		window.location.href = "../0328/HTMLjiaocheng.html";
    	}
    	function shuaxin(){
    		window.location.reload();
    	}
    	function xh(){
    		window.history.go(1);
    	}
    </script>
    

      

  • 相关阅读:
    UVA401
    CodeForces 1330A
    CodeForces 1328C
    FZU 1759
    LightOJ 1259
    LightOJ 1341
    SDUT3930
    java入门 学习日志九(面向对象七)
    html 制作简单网页
    java入门 学习日志八(面向对象六)
  • 原文地址:https://www.cnblogs.com/zhangrui0328/p/8858112.html
Copyright © 2011-2022 走看看