<html> <body> <p>aaaaa</p> <input type="button" value="confirm"/>
<div id=”mydiv”> some text </div>
<input type=”radio” value=”red” name=”color” id=”colorRed”>
<input type=”radio” value=”green” name=”color” id=”colorGreen” testatr=”testvalue”> </body> </html>
1.獲得html標籤
var html=document.documentElement
var html=document.childNodes[0]
var html= document.firstChild
2. 獲得body標籤
var body= document.body
3. 獲得文檔標題
var title= document.title;
document.title=”new titile”;
4. 獲得URL,Domain,Referrer,及跨域問題
var url= document.URL;//獲得瀏覽器地址欄中完整的URL信息
var domain= document.domain;//獲取該頁面的域名
var referrer=document.referrer;//表示連接到此頁面的URL地址信息,可爲空。
對於頁面中包含其他子域的框架或內嵌框架時,由於javascript 無法跨域訪問,此時可以設置referrer屬性來解決跨域問題。
假設www.test.com內某頁面加載了來自p2p.test.com的內嵌框架,可以將domain 設置爲test.com來解決跨域問題。
具體可以參考http://www.cnblogs.com/rainman/archive/2011/02/20/1959325.html;
5. 根據id獲得元素
var div= document.getElementById(“mydiv”); //僅返回文檔中第一次出現的元素。
6. 根據tag name 獲得元素
var img= document.getElementsByTagName(“img”);//返回HTMLCollection
7. 根據name屬性獲得元素
var radio=document.getElementsByName(“color”);
8. 其他特殊的集合
document.anchors: 包含name特性的所有<a> 元素
document.forms :所有<form>元素,同document.getElementsByTagName(“form”)
document.images : 所有<img> 元素集合
document.links : 所有含href特性的<a> 元素
9. 獲取自定義屬性值
var q= document.getElementById(“mydiv”).getAttribute(“testatr”);
10.創建元素
var div=document.createElement(“div”);
div.id=”newdivid”;
div.className=”box”;
document.body.appendChild(div);
11. 動態javacript,css
<script type=”text/javascript” src=”client.js”></script>
或<script type=”text/javascript”>
function sayhi(){
alert(“hi”);
}
</script>
var script =document.createElement(“script”);
script.type=”text/javascript”;
script.src=”client.js”或
var function=”function sayhi(){alert(‘hi’);}”;
try{
script.appendChild(document.createTextNode(“function”));
}catch(ex){
script.text=”function”;
}
document.body.appendChild(“script”);
考慮到不同瀏覽器兼容性,彙總如下:
<script type="text/javascript"> function loadscript(url){ //<script type=”text/javascript” src=”client.js”></script> var script =document.createElement(“script”); script.type=”text/javascript”; script.src=url; document.body.appendChild(script); } function loadscripttext(code){ //<script type=”text/javascript”> //function sayhi(){alert("hi");} //</script> var script =document.createElement(“script”); script.type=”text/javascript”; try{ script.appendChild(document.createTextNode(“function”)); }catch(ex){ //IE 視script爲特殊元素,不允許修改script子節點 script.text=”function”; } document.body.appendChild(script); } function loadstyle(url){ //<link rel="stylesheet" type="text/css" href="style.css"> var link =document.createElement(“link”); link.rel="stylesheet"; link.type=”text/css”; link.href=url; var head =document.getElementsByTagName("head")[0]; head.appendChild(link); } function loadstyletext(css){ //<style type=”text/css”> //body{background-color:red} //</style> var style =document.createElement(“style”); style.type=”text/css”; try{ style.appendChild(document.createTextNode(css)); }catch(ex){ //IE 視style爲特殊元素,不允許修改style子節點 style.text=css; } var head =document.getElementsByTagName("head")[0]; head.appendChild(link); } </script>