html dom小案例

阿新 • • 發佈：2018-12-26

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>

	<body>
		<ul>
			<li>
				<a class="pop" href="img/a.jpg" onclick="show()" title="a">a</a>
			</li>
			<li>
				<a class="pop" href="img/b.jpg" title="b">b</a>
			</li>
			<li>
				<a class="pop" href="img/c.png" title="c">c</a>
			</li>
			<li>
				<a class="pop" href="img/d.png" title="d">d</a>
			</li>
			<li>
				<a class="pop" href="img/e.png" title="e">e</a>
			</li>
		</ul>
		
		<script type="text/javascript">
			window.onload = function() {
				//確保向後相容性
				if(!document.getElementsByTagName)) {
				return false;
			}
			var list = document.getElementsByTagName("a");
			for(var i = 0; i < list.length; i++) {
				if(list[i].getAttribute("class") == "pop") {
					list[i].onclick = function() {
						window.event.returnValue = false;
						popUp(this.getAttribute("href"));
					}
				}
			}
			}

			function popUp(href) {
				window.open(href, "newPop", "width=300,height=200");
			}
		</script>
	</body>

</html>

html dom小案例

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <bod

xml jasp dom解析的小案例學生成績系統

cn.dimain bean存在的包Student.java cn.dao 對xml的增刪改查 StudentDao.java cn.exception 存放異常 StudentNotExistException.java cn.utils 存放工具類 XmlUti

Hibernate 入門小案例

java程序 div nocache org student 包含 target .so tell 前言：學習學到現在終於要學習框架了，心裏有點小激動呢，也不知道自己能不能學好呢，只能按著一步一個腳印的走下去，好了廢話不多說。讓我們打開hibernate

javascrip基礎以及一個計算器的小案例

defined 屬性和方法操作 undefined logs 大小寫數字 bst 全局 1.js的概述 js是一種腳本語言 js是可插入html頁面的編程代碼 js插入html頁面後,可由所有的瀏覽器執 2.js的基本語法與java一樣,變量,函數名,運算符以及

JQuery基礎以及5個小案例

進行 change 遍歷 selectall 獲得 idea 獲取設置 html 1.JQ完成定時彈出廣告　　步驟分析創建html文檔在頁面中創建一個廣告部分的div,設置div隱藏設置定時操作,1秒執行一個顯示的方法設置定時操作.1秒執行一個隱藏方法 /

HTML DOM item() 方法

child best ner == asc ctype sre 回文代碼一直不知道javascript還有類似jQ裏面eq()的函數，原來原生javascript的item()有類似功能：由於是原生javascript,先補習下children和childNodes

HTML DOM addEventListener() 方法

innerhtml err 版本號 list 更多 use run afa 手冊定義和用法 addEventListener() 方法用於向指定元素添加事件句柄。提示：使用 removeEventListener() 方法來移除 addEventListener()

cookie的基礎以及小案例

腳本元素 direct his 常用變量所有 arr 編譯 date 1.會話技術　　用戶打開一個瀏覽器訪問頁面,訪問網站的很多頁面,訪問完成後將瀏覽器關閉的過程稱為是一次會話 cookie:將數據保存到客戶端瀏覽器 session:將數據保存到服務器端向瀏覽器保

核心DOM和html DOM的區別

技術分享 row 標簽 node splay out mov ... tex DOM分為三部分：（1）核心DOM：遍歷DOM樹、添加新節點、刪除節點、修改節點（2）HTML DOM：以一種簡便的方法訪問DOM樹（3）XML DOM：準用於操作XML文檔核心D

Java小案例——對字符串進行加密解密

i++ 個數 color class 異或運算揭秘 println scanner 英文要求：　　* 對用戶輸入的每個字符的值進行加密，將解密後的字符串輸出　　 * 對用戶輸入的已加密字符串進行解密並輸出實現代碼： import java.util.Sca

Java小案例——判斷所給年份是平年還是閏年

年份平年 pre stat sca java next 用戶 string 要求：　　* 判斷用戶輸入的年份是平年還是閏年實現代碼： import java.util.Scanner; /** * 要求： * 判斷用戶輸入的年份是平年還是閏年 *

JS小案例(基礎好煩惱少)----持續更新

eof 最大值 res 應該 for tin title style 最小 1 *************************************************** 2 <!DOCTYPE html> 3 <html lan

js學習總結----經典小案例之選項卡

scrip ges div 視頻內容 mil line 學習總結 images ul li <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

HTML DOM 屬性

使用 tab 簡單方法 htm 文本節點 undefined text 大寫 null innerHTML 屬性獲取元素內容的最簡單方法是使用 innerHTML 屬性。 innerHTML 屬性對於獲取或替換 HTML 元素的內容很有用。實例下面的代碼獲取 id="

JavaScript HTML DOM

文檔 pre tel mod 實例最簡 nts model images 通過 HTML DOM，可訪問 JavaScript HTML 文檔的所有元素。 HTML DOM （文檔對象模型）當網頁被加載時，瀏覽器會創建頁面的文檔對象模型（Document Object

JavaScript HTML DOM 元素（節點）

enc javascrip item pan 效果 demo 移動元素成功 append 在文檔對象模型 (DOM) 中，每個節點都是一個對象。DOM 節點有三個重要的屬性： 1. nodeName : 節點的名稱 2. nodeValue ：節點的值 3. no

html的小例子

var () doc closed 模擬 http 需要 class logs 常用的前端實例： 1略 2、在網頁商城中的圖片當我們把鼠標放上去之後，圖片會顯示一個有顏色的外邊框，圖片某一部分的字體的顏色並發生改變鼠標放上去之前鼠標放上去之後：實

js學習總結----小案例之跑馬燈

htm function 微博 border ron == 內容 rip gree 具體代碼如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"

JavaScript HTML DOM - 改變CSS

head char document ctype .cn body pre 語法 logs 改變 HTML 樣式 //語法document.getElementById(id).style.property=new style <p id="p2">He

JavaScript HTML DOM 事件

pan 代碼 inner date load ntb 用戶按鈕 scrip 對事件做出反應我們可以在事件發生時執行 JavaScript，比如當用戶在 HTML 元素上點擊時。如需在用戶點擊某個元素時執行代碼，請向一個 HTML 事件屬性添加 JavaScript 代

html dom小案例

相關推薦