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>
    

      

  • 相关阅读:
    stringstream复用【原创】
    C++访问权限【原创】
    C++进阶阅读
    程序员的自我修养-装载、链接与库【原创】
    WinDebug 常用命令表【摘】
    重要说明与访问必看
    Beyond Compare V3.2.3 Beta 中文版
    Batch File Rename Utility(文件批量改名软件) 1.1.4231
    Defraggler(磁盘整理软件) V2.21.993 绿色版
    DiskGenius(磁盘分区/数据恢复) 32位 V4.9.1 免费绿色版
  • 原文地址:https://www.cnblogs.com/zhangrui0328/p/8858112.html
Copyright © 2011-2022 走看看