首页手记 JavaScript入门篇

JavaScript入门篇

标签：

JavaScript

JavaScript入门

拙见：JavaScript可使网页动态化，是因为JavaScript对网页载入了一段逻辑，在这个逻辑之中且可对网页进行操作。

常用互动方法

1. 输出内容：document.write

     直接输出内容：用"",直接输出括号内的内容:write("zifuchuang")
     通过变量：输出内容:write(var)
     输出多项内容：内容之间用‘+’连接:write("zifuhcuang"+var)
     输出HTML标签：使用""括起来:write("<br />")

2. 对话框
    警告对话框:alert("提示信息") 

    确认框

        应用场景：通常让用户进行选择，通过返回值判断用户点击了什么按钮
        语法：confirm(str)
             str：在消息框中显示的文本
             返回值：Boolean 
    提问对话框

        应用场景：与用户进行文本的交互
        语法：prompt(str1,str2)
            str1:要显示在消息对话框中的文本，不可修改。
            str2:文本框中的内容，可以修改。
            返回值：确定，返回文本框中的文本。
                   取消，返回null

3.  新窗口
    打开超链接时窗口的位置和各个参数
    语法：window.open(URL,["窗口名称"]，["参数字符串"])
        窗口名称
            1. 同变量命名方式一样
            2. 特殊意义的名称
                _blank:在新窗口显示目标网页
                _self:在当前窗口显示目标网页
                _top:_top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。
            3. 相同的name的窗口只能显示一个

        参数字符串：常用的参数
            width，height=px
            menubar,toolbar,scrollbar,status(状态栏)=yes|no
        返回值： 窗口对象
        关闭窗口：窗口对象.close（）

DOM树

    拙见：就像数据结构的树一样，
    作用：
        有了DOM树可以更方便的对HTML文档中的节点进行操作。
    结构：多个节点构成
        节点类型
            元素节点<body>,<nav>
            属性节点class,border
            文本节点 
    操作：
        1. 通过ID获取元素:document.getElementById("id")
            获取的元素是一个对象，下面元素进行操作，就要通过它的属性和方法
        2. 对象属性
            innerHTML：元素的内容
                Object.innerHTML:获取该节点元素的内容，或进行赋值修改。注意innerHTML的大小写。
            style：元素的样式
                Object.style.hight,Object.style.color等等，获取样式，或进行赋值修改。

                显示或隐藏元素
                style.display=none|block

                    none：隐藏
                    block：显示
            className：
            object.className设置或返回元素的class属性,通过更改css的类名来更改样式。

本文出自慕课网，转载请注明出处，侵权必究。

点击查看更多内容