自己學習總結的一些簡單的js.
錨點
<a name="html">HTML 教程</a><br>
<a name="css">CSS 教程</a><br>
<a name="xml">XML 教程</a><br>
<a href="/js/">JavaScript 教程</a>
document.write(document.anchors.length);//獲取錨點數
錨點數量爲3個 a標籤name指向的是錨點
innerHTML
定義
innerHTML 屬性設置或返回表格行的開始和結束標籤之間的 HTML。
用法1：
<body>
<a name="html">HTML 教程</a><br>
<a name="css">CSS 教程</a><br>
<a name="xml">XML 教程</a><br>
<a id="html">HTML 教程</a>
<p>文檔中第一個錨:
<script>
document.write(document.anchors[0].innerHTML);
</script>
</p>
</body>結果爲 HTML 教程
document.getElementById("html").innerHTML也可獲得同樣的結果
用法2
<script>
function myFunction(){
document.getElementById("demo").innerHTML="我的第一個 JavaScript 函數";
}
</script>
</head>
<body>
<h1>我的 Web 頁面</h1>
<p id="demo">一個段落。</p>
<button type="button" onclick="myFunction()">點擊這裏</button>
</body>結果爲：p標籤的內容爲
我的第一個 JavaScript 函數
調用外部的js
<script src="myScript.js"></script>調用一個名爲myScript的js文件
document.write
請使用 document.write() 僅僅向文檔輸出寫內容。
如果在文檔已完成加載後執行 document.write，整個 HTML 頁面將被覆蓋
例子：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>document.write()</title>
</head>
<body>
<h1>會被覆蓋</h1>
<p>我的段落。會被覆蓋</p>
<button onclick="myFunction()">點我</button>
<script>
function myFunction()
{
document.write(Date());
}
</script>
</body>
</html>console.log()
作用在控制檯輸出。
換行
可以使用反斜槓“\”進行換行document.write("你好 \
世界!");可以正常顯示，不能下面這樣使用！
document.write \
("你好世界!");對象創建方法
方法一：
function Obj(){
var obj=new Object();
obj.name="小明";
obj.age=12;
obj.ontFun=function(){
}//可以有多個方法
/* obj.twoFun=function(){
}*/
return obj;
}
var one=Obj();方法二：
把第一種方法的//var one = Obj();
//換成
var one = new Obj;其他方法：
var one = {name : '小明', age : 12 , oneFun : function(){ ... } }
//或
var one= new Ojbect();
one.name = '小明';
one.age = 12;
one.oneFun = function(){ }typeof操作符
typeof可以檢測數據類型。
typeof "str" // 返回 string
typeof 12 // 返回 number
typeof false // 返回 boolean
typeof [1,2,3,4] // 返回 object
typeof {name:'小明', age:12} // 返回 objecttypeof null //返回object
var person = null
typeof person //返回object
var person = undefined
typeof person //返回undefinedvar person; // 值爲 undefined(空), 類型是undefined
typeof person //返回undefinedundefined與null的區別
null 和 undefined 的值相等，但類型不等
typeof undefined // undefined
typeof null // object
null === undefined // false
null == undefined // trueconstructor 屬性
"John".constructor // 返回函數 String() { [native code] }
(3.14).constructor // 返回函數 Number() { [native code] }
false.constructor // 返回函數 Boolean() { [native code] }
[1,2,3,4].constructor // 返回函數 Array() { [native code] }
{name:'John', age:34}.constructor // 返回函數 Object() { [native code] }
new Date().constructor // 返回函數 Date() { [native code] }
function () {}.constructor // 返回函數 Function(){ [native code] }自動轉換類型
當 JavaScript 嘗試操作一個 "錯誤" 的數據類型時，會自動轉換爲 "正確" 的數據類型。
5 + null // 返回 5 null 轉換爲 0
"5" + null // 返回"5null" null 轉換爲 "null"
"5" + 1 // 返回 "51" 1 轉換爲 "1"
"5" - 1 // 返回 4 "5" 轉換爲 5href="#"與href="javascript:void(0)"的區別
# 包含了一個位置信息，默認的錨是#top 也就是網頁的上端。而javascript:void(0), 僅僅表示一個死鏈接。
在頁面很長的時候會使用 # 來定位頁面的具體位置，格式爲：# + id。
如果你要定義一個死鏈接請使用 javascript:void(0) 。
<a href="javascript:void(0);">點我沒有反應的!</a>
<a href="#pos">點我定位到指定位置!</a>
<br>
...
<br>
<p id="pos">尾部定位點</p>#pos可以定位到id尾pos的尾部定位點
HTML DOM 樹
通過 id 查找 HTML 元素
var id=document.getElementById("id");通過標籤名查找 HTML 元素
var id=document.getElementById("id");
var p=id.getElementsByTagName("p");通過類名找到 HTML 元素
var className=document.getElementsByClassName("className");數字
當一個數字直接出現在JavaScript程序中，我們稱之爲數字直接量，注意，在任何數字直接量前加負號（-）可以得到他們的負值，但負號是一元求反運算符，並不是數字直接量語法的組成部分。