function hidetext()
{
var mychar = document.getElementById("con");
mychar.style.display="none";
}
<p id="con">做為一個Web開發師來說，如果你想提供漂亮的網頁、令用戶滿意的上網體驗，JavaScript是必不可少的工具。</p>
<form> <input type="button" onclick="hidetext()" value="隱藏內容" /> </form>點擊按鈕時，觸發hidetext函數已顯示的p的內容將隱藏
{
var mychar = document.getElementById("con");
mychar.style.display="none";
}
<p id="con">做為一個Web開發師來說，如果你想提供漂亮的網頁、令用戶滿意的上網體驗，JavaScript是必不可少的工具。</p>
<form> <input type="button" onclick="hidetext()" value="隱藏內容" /> </form>點擊按鈕時，觸發hidetext函數已顯示的p的內容將隱藏
2015-05-24
顯示和隱藏的效果，可通過display屬性來設置。語法：Object.style.display = "value"; value的值為none(不顯示，隱藏);block(顯示為塊級元素)
注意:Object是獲取的元素對象，如通過document.getElementById("id")獲取的元素。
注意:Object是獲取的元素對象，如通過document.getElementById("id")獲取的元素。
2015-05-24
HTML DOM 允許 JavaScript 改變 HTML 元素的樣式(像css那樣設置樣式：顏色，大小，背景等)
語法:Object.style.property=new style; 注意:Object是獲取的元素對象，如通過document.getElementById("id")獲取的元素。
var mychar= document.getElementById("con");
mychar.style.color="red";
mychar.style.backgroundColor="#ccc";
mychar.style.width="300px";
語法:Object.style.property=new style; 注意:Object是獲取的元素對象，如通過document.getElementById("id")獲取的元素。
var mychar= document.getElementById("con");
mychar.style.color="red";
mychar.style.backgroundColor="#ccc";
mychar.style.width="300px";
2015-05-24
<h2 id="con">javascript</h2>
<script type="text/javascript">
var mychar= document.getElementById("con") ;
document.write("原標題:"+mychar.innerHTML+"<br>"); 輸出原h2標簽內容
mychar.innerHTML="Hello world!"有對原對象內容的修改，h2會顯示為修改后內容
document.write("修改后的標題:"+mychar.innerHTML); 輸出修改后h2標簽內容
</script>
<script type="text/javascript">
var mychar= document.getElementById("con") ;
document.write("原標題:"+mychar.innerHTML+"<br>"); 輸出原h2標簽內容
mychar.innerHTML="Hello world!"有對原對象內容的修改，h2會顯示為修改后內容
document.write("修改后的標題:"+mychar.innerHTML); 輸出修改后h2標簽內容
</script>
2015-05-24
innerHTML 屬性用于獲取或替換 HTML 元素的內容。
語法:Object.innerHTML
注意:
1.Object是獲取的元素對象，如通過document.getElementById("ID")獲取的元素
2.innerHTML區分大小寫。
語法:Object.innerHTML
注意:
1.Object是獲取的元素對象，如通過document.getElementById("ID")獲取的元素
2.innerHTML區分大小寫。
2015-05-24
標簽的id屬性值是唯一的，就像是每人有一個身份證號一樣，只要通過身份證號就可以找到相對應的人。那么在網頁中，我們通過id先找到標簽，然后進行操作。
語法:
document.getElementById(“id”)
注:獲取的元素是一個對象，如想對元素進行操作，我們要通過它的屬性或方法。
1.document.getElementById("con")
2.直接輸出獲取的對象，結果為null或[object HTMLParagraphElement]
document.getElementById("con").innerHTML為獲取標簽中的內容。
語法:
document.getElementById(“id”)
注:獲取的元素是一個對象，如想對元素進行操作，我們要通過它的屬性或方法。
1.document.getElementById("con")
2.直接輸出獲取的對象，結果為null或[object HTMLParagraphElement]
document.getElementById("con").innerHTML為獲取標簽中的內容。
2015-05-24
文檔對象模型DOM（Document Object Model）定義訪問和處理HTML文檔的標準方法。DOM 將HTML文檔呈現為帶有元素、屬性和文本的樹結構（節點樹）。
HTML文檔可以說由節點構成的集合，三種常見的DOM節點:
1. 元素節點：上圖中<html>、<body>、<p>等都是元素節點，即標簽。
2. 文本節點:向用戶展示的內容，如<li>...</li>中的JavaScript、DOM、CSS等文本。
3. 屬性節點:元素屬性，如<a>標簽的鏈接屬性href="http://www.xianlaiwan.cn"。
HTML文檔可以說由節點構成的集合，三種常見的DOM節點:
1. 元素節點：上圖中<html>、<body>、<p>等都是元素節點，即標簽。
2. 文本節點:向用戶展示的內容，如<li>...</li>中的JavaScript、DOM、CSS等文本。
3. 屬性節點:元素屬性，如<a>標簽的鏈接屬性href="http://www.xianlaiwan.cn"。
close()關閉窗口
用法：
window.close(); //關閉本窗口
或
<窗口對象>.close(); //關閉指定的窗口
例如:關閉新建的窗口。
<script type="text/javascript">
var mywin=window.open('http://www.xianlaiwan.cn'); //將新打的窗口對象，存儲在變量mywin中
mywin.close();
</script>
注意:上面代碼在打開新窗口的同時，關閉該窗口，看不到被打開的窗口。
體會效果查看此章節。
用法：
window.close(); //關閉本窗口
或
<窗口對象>.close(); //關閉指定的窗口
例如:關閉新建的窗口。
<script type="text/javascript">
var mywin=window.open('http://www.xianlaiwan.cn'); //將新打的窗口對象，存儲在變量mywin中
mywin.close();
</script>
注意:上面代碼在打開新窗口的同時，關閉該窗口，看不到被打開的窗口。
體會效果查看此章節。
2015-05-24
<script type="text/javascript">
function add(){
document.getElementById("p1").className="one"
}
function modify(){
document.getElementById("p2").className="two";
}
</script>
function add(){
document.getElementById("p1").className="one"
}
function modify(){
document.getElementById("p2").className="two";
}
</script>
2015-05-23
改變 HTML 樣式
語法:Object.style.property=new style;
注意:Object是獲取的元素對象
var mychar = document.getElementById("pcon");【先提出元素放入盒子
mychar.style.color="red";【再以這種格式改變樣式
語法:Object.style.property=new style;
注意:Object是獲取的元素對象
var mychar = document.getElementById("pcon");【先提出元素放入盒子
mychar.style.color="red";【再以這種格式改變樣式
2015-05-23
mychar.style.display="none";
mychar.style.display="block";
mychar.style.display="block";
2015-05-23
mychar.style.color="red";
mychar.style.backgroundColor="gray";
mychar.style.width="300px";
mychar.style.backgroundColor="gray";
mychar.style.width="300px";
2015-05-23
<p id="con">hello world!</p>
<script type="text/javascript">
var mychar=document.getElementById("con").innerHTML;
document.write("結果:"+mychar); //輸出獲取的P標簽。
</script>
<script type="text/javascript">
var mychar=document.getElementById("con").innerHTML;
document.write("結果:"+mychar); //輸出獲取的P標簽。
</script>
2015-05-23