为了账号安全，请及时绑定邮箱和手机立即绑定
慕课网数字资源数据库体验端
获取体验码
JavaScript入门篇 _学习笔记_慕课网
为了账号安全，请及时绑定邮箱和手机立即绑定
精品课程 JavaScript入门篇

JavaScript入门篇

慕课官方号 页面重构设计
难度入门
时长 1小时35分
最热 最新
  • 啊这_fmtCNT

    window.open()函数使用说明

    https://img1.sycdn.imooc.com/e7807f6909d1f58b05590586.jpg

    https://img1.sycdn.imooc.com/ff819c6909d1f5b307570389.jpg

    查看全部
    0 采集 收起 来源：JavaScript-打开新窗口（window.open）

    1天前

  • 超级大南瓜

    <!DOCTYPE HTML>

    <html>

    <head>

    <meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />

    <title>javascript</title>

    <style type="text/css">

    body{font-size:12px;}

    #txt{

        height:400px;

        width:600px;

        border:#333 solid 1px;

        padding:5px;}

    p{

        line-height:18px;

        text-indent:2em;}

    </style>

    </head>

    <body onload="saveInitialStatus()">

      <h2 id="con">JavaScript课程</H2>

      <div id="txt">

         <h5>JavaScript为网页添加动态效果并实现与用户交互的功能。</h5>

            <p>1. JavaScript入门篇，让不懂JS的你，快速了解JS。</p>

            <p>2. JavaScript进阶篇，让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。</p>

            <p>3. 学完以上两门基础课后，在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。</p>

      </div>

      <form>

      <!--当点击相应按钮，执行相应操作，为按钮添加相应事件-->

        <input type="button" value="改变颜色" onClick="color()">  

        <input type="button" value="改变宽高" onClick="widthheight()">

        <input type="button" value="隐藏内容" onClick="hide()">

        <input type="button" value="显示内容" onClick="show()">

        <input type="button" value="取消设置" onClick="cancel()">

      </form>

      <script type="text/javascript">

    //保存初始值

    var initialColor = "";

    var initialBackgroundColor = "";

    var initialWidth = "";

    var initialHeight = "";


    function saveInitialStatus(){

        var con = document.getElementById("con");

        var txt = document.getElementById("txt");

        initialColor = con.style.color || "";

        initialBackgroundColor = con.style.backgroundColor || "";

        initialWidth = txt.style.width || "";

        initialHeight = txt.style.height || "";

    }


    //定义"改变颜色"的函数

    function color(){

        var color=document.getElementById("con");

        color.style.backgroundColor="green";

        color.style.color="red";

    }


    //定义"改变宽高"的函数

    function widthheight(){

        var size=document.getElementById("txt");

        size.style.width="400px";

        size.style.height="600px";

    }


    //定义"隐藏内容"的函数

    function hide(){

        var hide=document.getElementById("txt");

        hide.style.display="none";

    }


    //定义"显示内容"的函数

    function show(){

        var hide=document.getElementById("txt");

        hide.style.display="block";

    }


    //定义"取消设置"的函数

    function cancel(){

        var con = document.getElementById("con");

        var txt = document.getElementById("txt");

        con.style.color = initialColor;

        con.style.backgroundColor = initialBackgroundColor;

        txt.style.width = initialWidth;

        txt.style.height = initialHeight;

    }



      </script>

    </body>

    </html>

    查看全部
    0 采集 收起 来源：编程挑战

    2026-01-07

  • 超级大南瓜

    <!DOCTYPE html>

    <html>

     <head>

      <title> new document </title>  

      <meta http-equiv="Content-Type" content="text/html; charset=gbk"/>   

      <script type="text/javascript">  

        

        // 新窗口打开时弹出确认框，是否打开


        // 通过输入对话框，确定打开的网址，默认为 http：//www.imooc.com/


        //打开的窗口要求，宽400像素，高500像素，无菜单栏、无工具栏。

        function openWindow(){

            var message=confirm("是否打开新窗口");

            if (message==true){

                window.open('https://www.imooc.com','_blank','width=400,height=500,menubar=no,toolbar=no')

            }

            else{

                return 0;

            }

        }

        

      </script> 

     </head> 

     <body> 

      <input type="button" value="新窗口打开网站" onclick="openWindow()" /> 

     </body>

    </html>

    查看全部
    0 采集 收起 来源：编程练习

    2026-01-07

  • 超级大南瓜

    <!DOCTYPE HTML>

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>close()</title>

      <script type="text/javascript">

        function winop(){

            window.open("http://www.imooc.com",'_blank','height=300,width=300,top=100,left=0');

        }

        function wincl(){

            window.close();

        }

      </script>

    </head>

    <body>

        <input name="button" type="button" onClick="winop()" value="打开窗口" \>

        <input name="button" type="button" onClick="wincl()" value="关闭窗口" \>

    </body>

    </html>

    查看全部
    0 采集 收起 来源：JavaScript-关闭窗口（window.close）

    2026-01-07

  • BINOM

    <script type="text/javascript"> window.open('http://www.imooc.com','_blank','width=300,height=200,menubar=no,toolbar=no, status=no,scrollbars=yes')
    </script>

    查看全部
    0 采集 收起 来源：编程练习

    2026-01-05

  • BINOM

    <script type="text/javascript">
       var mymessage=confirm("你喜欢JavaScript吗?");
       if(mymessage==true)
       {   document.write("很好,加油!");   }
       else
       {  document.write("JS功能强大，要学习噢!");   }
    </script>

    查看全部
    0 采集 收起 来源：编程练习

    2026-01-05

  • 零下一度的雨

    close()关闭窗口

    window.close(); 关闭本窗口

    <窗口对象>.close(); 关闭指定的窗口


    例如将新打开的窗口对象存储在变量中   变量.close();  来关闭

    查看全部
    0 采集 收起 来源：JavaScript-关闭窗口（window.close）

    2025-12-24

  • 零下一度的雨

    window.open([URL], [窗口名称], [参数字符串])    打开一个新窗口

    URL：可选参数，在窗口中要显示网页的网址或路径。如果省略这个参数，或者它的值是空字符串，那么窗口就不显示任何文档。

    窗口名称：可选参数，被打开窗口的名称。    

    1. 该名称由字母、数字和下划线字符组成。
      2."_top"、"_blank"、"_self"具有特殊意义的名称。
             _blank：在新窗口显示目标网页
             _self：在当前窗口显示目标网页
             _top：框架网页中在上部窗口中显示目标网页
      3.相同 name 的窗口只能创建一个，要想创建多个窗口则 name 不能相同。4.name 不能包含有空格。参数字符串：可选参数，设置窗口参数，各参数用逗号隔开。

    参数表:top窗口离屏幕顶部的像素  left窗口离屏幕左边的像素  width窗口宽度像素  height窗口高度像素  menubar(yes/no)有无菜单栏  toolbar有无工具栏  status有无状态栏  scrollbar有无滚动条

    查看全部
    0 采集 收起 来源：JavaScript-打开新窗口（window.open）

    2025-12-23

  • 零下一度的雨

    prompt弹出消息对话框,通常用于询问一些需要与用户交互的信息。弹出消息对话框（包含一个确定按钮、取消按钮与一个文本输入框）。


    prompt(str1, str2); str1为显示在消息对话框中的文本,不可修改    str2为文本输入框中的内容,可以修改


    返回值: 点击确定按钮,文本框中的内容作为函数返回值    点击取消将返回null


    同样可根据返回值使用if...else来输出不同内容  在用户点击对话框的按钮前，不能进行任何其它操作。

    查看全部
    0 采集 收起 来源：JavaScript-提问（prompt 消息对话框）

    2025-12-23

  • 零下一度的雨

    confirm 消息对话框通常用于允许用户做选择的动作，弹出对话框包括一个确定按钮和一个取消按钮。

    confirm(str);   str为在消息对话框中显示的文本

    返回值:Boolean值,当用户点击确定时返回ture;点击取消时返回false   可通过返回值判断用户点击了什么按钮 从而可以通过if...else来输出不用内容

    消息对话框是排它的，即用户在点击对话框按钮前，不能进行任何其它操作。

    查看全部
    0 采集 收起 来源：JavaScript-确认（confirm 消息对话框）

    2025-12-23

  • 零下一度的雨

    JavaScript-警告

    消息提示框 alert(字符串或变量);

    alert弹出消息对话框包含一个确定按钮。在点击对话框"确定"按钮前，不能进行任何其它操作。消息对话框通常可以用于调试程序。alert输出内容，可以是字符串或变量，与document.write 相似。

    可以按顺序弹出多个对话框

    查看全部
    0 采集 收起 来源：JavaScript-警告（alert 消息对话框）

    2025-12-23

  • 零下一度的雨

    document.write( )用于直接向HTML输出内容

    第一种:输出内容用""括起，直接输出""号内的内容

    第二种:通过变量，输出内容

    第三种:输出多项内容，内容之间用+号连接  比如 变量+"文字内容"

    第四种:输出HTML标签，并起作用，标签使用""括起来 比如 "<br>"输出一个换行符

    如果想要实现输出空格，可以使用特殊字符“&nbsp;”实现

    查看全部
    0 采集 收起 来源：JavaScript-输出内容（document.write）

    2025-12-23

  • 零下一度的雨

    定义函数:

    function 函数名()

    {
         函数代码;
    }

    函数定义好后，是不能自动执行的，所以需调用它,只需直接在需要的位置写函数就ok了

    <input type="button" value="点击我" onclick="contxt()" /> //contxt()为之前定义好的函数

    查看全部
    0 采集 收起 来源：JavaScript-什么是函数

    2025-12-23

  • 零下一度的雨

    判断语句   if...else

    if(条件)
    { 条件成立时执行的代码 }

    else

    { 条件不成立时执行的代码 }

    查看全部
    0 采集 收起 来源：JavaScript-判断语句（if...else）

    2025-12-23

  • 零下一度的雨

    变量要先声明再赋值  可以重复复制

    var mychar;
    mychar="javascript";
    mychar="hello";

    var mynum = 6;

    在JS中区分大小写，如变量mychar与myChar是不一样的，表示是两个变量。

    查看全部
    0 采集 收起 来源：JavaScript-什么是变量

    2025-12-23

首页上一页1234567下一页尾页

举报

0/150
提交
取消
开始学习
课程须知
该课程是针对新手的一个简单基础的课程，让您快速了解JS，通过一些简单的代码编写体会JS。如果您已经对JS有所了解，可以跳过本课程，学习JS进阶课程，进一步学习JS相应的基础知识。学习本课程，希望您至少具备HTML/CSS基础知识，认识常用的标签。
老师告诉你能学到什么？
1. 理解JavaScript基础语法； 2. 掌握常用语句的使用方法； 3. 学会如何获取DOM元素及进行简单操作。
友情提示：

您好，此课程属于迁移课程，您已购买该课程，无需重复购买，感谢您对慕课网的支持！

查看已购买的课程