JS學習文件

HCYUN發表於2016-10-09
原文網址 : https://blog.csdn.net/hcyun/article/details/52769695
JS

在朗沃的一年一來，學習到許多，收穫了許多



HTML與JS，完美的搭配，讓我領略到了前端的魅力，下面是我摘抄和整理的一些筆記以及借鑑他人的一些知識。在此謝謝別人無私的分享


1.在 JavaScript 中，document.write() 可用於直接向 HTML 輸出流寫內容。

<!DOCTYPE html>
<html>
<body>

<script>
document.write(Date());
</script>

</body>
</html>

<!DOCTYPE html>
<html>
<body>

<p>
JavaScript 能夠直接寫入 HTML 輸出流中：
</p>

<script>
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph.</p>");
</script>

<p>
您只能在 HTML 輸出流中使用 <strong>document.write</strong>。
如果您在文件已載入後使用它（比如在函式中），會覆蓋整個文件。
</p>


</body>
</html>


提示：絕不要使用在文件載入之後使用document.write()（比如在函式中使用這會覆蓋該文件。）

上面的例子是直接在script標籤中輸出，如果在函式中輸出document.write() 會覆蓋的，見下面的例子：

//大家可以直接複製過去，看看效果

<!DOCTYPE html>
<html>
<body>
<p>點選下面的按鈕，迴圈遍歷物件 "person" 的屬性。</p>
<button onclick="myFunction()">點選這裡</button>
<p id="demo"></p>


<script>
function myFunction()
{
var x;
var txt="";
var person={fname:"Bill",lname:"Gates",age:56}; 


for (x in person)
{
document.write(x+" ");   //注意此處：這樣會覆蓋掉下面的
 //document.getElementById("demo").innerHTML=txt;可以刪除document.write(x+" "); 這句話，然後

//看看效果就明白了
alert("x= "+x);
txt=txt + person[x];
}


document.getElementById("demo").innerHTML=txt;
}
</script>
</body>
</html>


參考見：http://www.w3school.com.cn/js/js_intro.asp

http://www.w3school.com.cn/tiy/t.asp?f=js_intro_document_write


2.Window 尺寸

有三種方法能夠確定瀏覽器視窗的尺寸（瀏覽器的視口，不包括工具欄和滾動條）。

對於Internet Explorer、Chrome、Firefox、Opera 以及 Safari：

  • window.innerHeight - 瀏覽器視窗的內部高度
  • window.innerWidth - 瀏覽器視窗的內部寬度

對於 Internet Explorer 8、7、6、5：

  • document.documentElement.clientHeight
  • document.documentElement.clientWidth

或者

  • document.body.clientHeight
  • document.body.clientWidth

實用的 JavaScript 方案（涵蓋所有瀏覽器）：

例項

var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;








相關文章