JS之基础篇

一、注意点：

1.JS是区分大小写，JS中的字符、符号等要在英文的状态下输入

2.JS中的函数

function 函数名() {
    函数代码;
}

二、常用的互动方法

1.输出内容： document.write  可直接向HTML输出流写内容（直接写在页面上）

（1）输出内容用""，直接输入双引号的内容

<script type="text/javascript">
    document.write("JavaScript");//输出JavaScript
</script>

(2)通过变量，输出内容

<script type="text/javascript">
    var mystr = "Hello Word";
    document.write(mystr);//直接写变量名，输出变量的内容
</script>

（3）输出多项内容，内容之间用+号连接

<script type="text/javascript">
    var mystr = "Hello Word";
    document.write(mystr + "My First Lesson");//多项内容用 + 连接
</script>

（4）输出HTML标签，并起作用，用""包裹起来

<script type="text/javascript">
    var mystr = "Hello Word";
    document.write(mystr + "<br/>");//输出Hello Word之后换行
    document.write("javascript");
</script>

---

JS中如何输出空格

---

在JS输出时会出现以下现象

     document.write("1          2          3 ");//输出结果：1 2 3

因为浏览器显示机制，对手动敲入的空格，将连续多个空格显示成1个空格。

解决方法：

（1）.使用输出html标签   来解决：

document.write("  " + "1" + "      " + "23");
//结果：1        23

（2）.使用CSS样式来解决问题：

document.write("<span style="white-space:pre;">" + "1     2     3" + "</span>")
//结果：1     2     3

2.警告 alert消息对话框 ：alert(字符串或者变量); （常用于调试程序）

<script type="text/javascript">
    var mystr = "Word";
    alter("Hello");
    alert(mystr);
</script>
//弹出两个对话框，先弹出Hello

3.确认 confirm消息对话框：confirm(str);

(1)参数说明：str:在消息对话框中显示的文本，返回值：Boolean值

(2)返回值：当用户点击确定按钮时，返回true，否则返回false

<script type="text/javascript">
    var mystr = confirm("你是女士吗？"); 
    if(mystr) {
        document.write("女士你好")
    }else {
        document.write("先生你好");
    }
</script>

4.提问 prompt 消息对话框：prompt(str1,str2);

(1)参数说明：str1:要显示在消息对话框中显示的文本，不可以修改；str2：文本框中的内容，可以修改

(2)返回值：点击确定按钮，文本框中得内容将作为函数返回值；点击取消按钮将返回null

<script type="text/javascript">
       var mystr = prompt("请输入姓名"); 
    if(mystr!=null) {
        document.write( mystr + "你好");
    }else {
        document.write("请输入姓名");
    }
</script>