JavaScript入门篇 _学习笔记

首页免费课 JavaScript入门篇笔记

JavaScript入门篇

                
                慕课官方号
            页面重构设计

                    查看讲师更多课程 
                    慕课官方号讲师的其他课程
                
帝堵抢车位动画制作
初级·36952
免费课程
                                
JavaScript进阶篇
入门·469067
免费课程
                                
                难度入门
            
                时长 1小时35分
            
                学习人数
            
综合评分9.57
                            5511人评价
                        查看评价
                                9.8
                                内容实用
                            
                                9.5
                                简洁易懂
                            
                                9.4
                                逻辑清晰

最热最新

FreudLi

var 变量名 = prompt("提示框提示文本", "输入框文本，不写为空");
// prompt(str1, str2);
//str1显示消息对话框的文本，不可修改
//str2 文本框中的内容，可修改
//点击消息框中的“确定”返回文本框中的内容
//点击消息框中的 "取消"，返回null
if ( 变量名! = null){
}
else{
}

查看全部

0 采集收起来源：JavaScript-提问（prompt 消息对话框）
2018-11-22
yayapsy

prompt() 消息对话框

查看全部

0 采集收起来源：JavaScript-确认（confirm 消息对话框）
2018-11-22
FreudLi

var 变量名 = confirm("提示信息");
//confirm(str);
//返回Boolean值，true / false
if (变量名==true){
}
else{
}

查看全部

0 采集收起来源：JavaScript-确认（confirm 消息对话框）
2018-11-22
慕斯卡7430691
改变 HTML 样式
HTML DOM 允许 JavaScript 改变 HTML 元素的样式。如何改变 HTML 元素的样式呢？
语法:
```
Object.style.property=new style;
```
注意:Object是获取的元素对象，如通过document.getElementById("id")获取的元素。
基本属性表（property）:
注意:该表只是一小部分CSS样式属性，其它样式也可以通过该方法设置和修改。
看看下面的代码:
改变 <p> 元素的样式，将颜色改为红色，字号改为20,背景颜色改为蓝：
```
<p id="pcon">Hello World!</p> <script>    var mychar = document.getElementById("pcon");    mychar.style.color="red";    mychar.style.fontSize="20";    mychar.style.backgroundColor ="blue"; </script>
```
结果:
任务
现在我们来改变下HTML中元素的CSS样式:
1. 在右边编辑器中，第12行补充代码，修改h2标签的样式，将颜色设为红色。
2. 在右边编辑器中，第13行补充代码，修改h2标签的样式，将背景颜色设为灰色(#CCC)。
3. 在右边编辑器中，第14行补充代码，修改h2标签的样式，将宽设为300px。
查看全部

0 采集收起来源：改变 HTML 样式
2018-11-22
慕斯卡7430691
innerHTML 属性
innerHTML 属性用于获取或替换 HTML 元素的内容。
语法:
```
Object.innerHTML
```
注意:
1.Object是获取的元素对象，如通过document.getElementById("ID")获取的元素。
2.注意书写，innerHTML区分大小写。
我们通过id="con"获取<p> 元素，并将元素的内容输出和改变元素内容，代码如下:
结果:
任务
1. 在右边编辑器中，第11行补充代码，通过id获取h2标签元素,并赋给变量mychar。
2. 在右边编辑器中，第13行补充代码，使用innerHTML属性，将获取的h2标签内容修改为"Hello world!"
查看全部

0 采集收起来源：innerHTML 属性
2018-11-22
qq_那小子_2
1. <!DOCTYPE HTML>
2. <html>
3. <head>
4. <meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
5. <title>javascript</title>
6. <style type="text/css">
7. body{font-size:12px;}
8. #txt{
10. height:400px;
11. width:600px;
12. border:#333 solid 1px;
13. padding:5px;}
15. p{
16. line-height:18px;
18. text-indent:2em;}
19. .po{
20. width: 100px;
21. height: 500px;
22. position: absolute;
23. left: 700px;
24. top: 80px;
25. }
27. </style>
29. </head>
31. <body>
33. <h2 id="con">JavaScript课程</H2>
35. <div id="txt">
37. <h5>JavaScript为网页添加动态效果并实现与用户交互的功能。</h5>
39. <p>1. JavaScript入门篇，让不懂JS的你，快速了解JS。</p>
41. <p>2. JavaScript进阶篇，让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。</p>
43. <p>3. 学完以上两门基础课后，在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。</p>
45. </div>
47. <form class="po">
49. 
51. <input type="button" value="改变颜色" onclick="changecolor()" > <br>
53. <input type="button" value="改变宽高" onclick="changewh()" ><br>
55. <input type="button" value="隐藏内容" onclick="H()" ><br>
57. <input type="button" value="显示内容" onclick="S()" ><br>
59. <input type="button" value="取消设置" onclick="esc()" ><br>
61. </form>
63. <script type="text/javascript">
64. var mytxt=document.getElementById("txt");
65. function changecolor(){
66. mytxt.style.color="red";
67. }
68. function changewh(){
69. mytxt.style.width="500px";
70. mytxt.style.height="200px";
71. }
72. function H(){
73. mytxt.style.display="none";
74. }
75. function S(){
76. mytxt.style.display="block";
77. }
78. function esc(){
79. mytxt.;
80. }
82. </script>
84. </body>
86. </html>
查看全部

0 采集收起来源：编程练习
2018-11-21
米歇尔菜菜

通过id获取元素
结果：null或者[object HTMLParapraphElement]
注：获取的元素是一个·元素，如想对元素进行操作，我们要通过他的属性或方法

查看全部

0 采集收起来源：通过ID获取元素
2018-11-21
米歇尔菜菜

通过ID获取元素
语法：document.gerElementId("id"
)

查看全部

0 采集收起来源：通过ID获取元素
2018-11-21
米歇尔菜菜

DOM定义访问和处理HTML文档的标准方法。DOM将HTML文档呈现为带有元素、属性、和文本的树结构。
HTML可以说是节点构成的集合，三种常见的DOM节点
1元素节点：<html>
2文本结构：向用户展示的内容
3属性节点：元素属性，如<a>标签的链接属性href="http://www.imooc.com".

查看全部

0 采集收起来源：认识DOM
2018-11-21

慕婉清9149038

JavaScript-打开新窗口（window.open）

语法：

window.open([URL], [窗口名称], [参数字符串])

URL：可选参数，在窗口中要显示网页的网址或路径。如果省略这个参数，或者它的值是空字符串，那么窗口就不显示任何文档。窗口名称：可选参数，被打开窗口的名称。    1.该名称由字母、数字和下划线字符组成。
    2."_top"、"_blank"、"_self"具有特殊意义的名称。
       _blank：在新窗口显示目标网页
       _self：在当前窗口显示目标网页
       _top：框架网页中在上部窗口中显示目标网页
    3.相同 name 的窗口只能创建一个，要想创建多个窗口则 name 不能相同。
   4.name 不能包含有空格。参数字符串：可选参数，设置窗口参数，各参数用逗号隔开。

查看全部

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

2018-11-21

逐云_
【prompt】弹出消息对话框,通常用于询问一些需要与用户交互的信息。弹出消息对话框（包含一个确定按钮、取消按钮与一个文本输入框）。
```
【prompt(str1, str2);】
```
var myname=prompt("请输入你的姓名:");
if(myname!=null)
{ alert("你好"+myname); }
else
{ alert("ok my friend."); }
}
参数说明：
```
str1: 要显示在消息对话框中的文本，不可修改
str2：文本框中的内容，可以修改
```
返回值:
```
1. 点击确定按钮，文本框中的内容将作为函数返回值
2. 点击取消按钮，将返回null
```
查看全部

0 采集收起来源：JavaScript-提问（prompt 消息对话框）
2018-11-21

逐云_

confirm(sb);【sb为 在弹窗中要显示的 文字】

当用户点击"确定"按钮时，返回true
当用户点击"取消"按钮时，返回false

这两个词为函数
【true 会弹出 第一个】
【false 会弹出 第二个】

查看全部

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

2018-11-21

逐云_

document.write() 可用于直接向 HTML 输出流写内容。简单的说就是直接在网页中输出内容。

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

<script type="text/javascript">
  document.write("I love JavaScript！"); //内容用""括起来，""里的内容直接输出。</script>

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

<script type="text/javascript">
  var mystr="hello world!";
  document.write(mystr);  //直接写变量名，输出变量存储的内容。</script>

第三种:输出多项内容，内容之间用+号连接。

<script type="text/javascript">
  var mystr="hello";
  document.write(mystr+"I love JavaScript"); //多项内容之间用+号连接</script>

第四种:输出HTML标签，并起作用，标签使用""括起来。

<script type="text/javascript">
  var mystr="hello";
document.write(mystr+"<br>");//输出hello后，输出一个换行符
  document.write("JavaScript");
</script>

查看全部

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

2018-11-21

逐云_
onclick="contxt()"【注意，cotxt后面有个括号（）不要漏掉】
function为定义函数的关键字（用来定义的代码）
"函数名"你为函数取的名字。
"函数代码"替换为完成特定功能的代码。
```
function 函数名(){
     函数代码;
}
```
查看全部

0 采集收起来源：JavaScript-什么是函数
2018-11-21
慕盖茨5956479
1、定义变量使用关键字var,语法如下：
```
var 变量名
```
2、变量名可以任意取名，但要遵循命名规则:
1.变量必须使用字母、下划线(_)或者美元符($)开始。
2.然后可以使用任意多个英文字母、数字、下划线(_)或者美元符($)组成。
3.不能使用JavaScript关键词与JavaScript保留字。
3、变量要先声明再赋值
4、变量可以重复赋值
5、注意:
1. 在JS中区分大小写，如变量mychar与myChar是不一样的，表示是两个变量。
2. 变量虽然也可以不声明，直接使用，但不规范，需要先声明，后使用。
查看全部

0 采集收起来源：JavaScript-什么是变量
2018-11-21

首页上一页 341 342 343 344 345 346 347 下一页尾页

0/150

提交

取消

开始学习

课程须知: 该课程是针对新手的一个简单基础的课程，让您快速了解JS，通过一些简单的代码编写体会JS。如果您已经对JS有所了解，可以跳过本课程，学习JS进阶课程，进一步学习JS相应的基础知识。学习本课程，希望您至少具备HTML/CSS基础知识，认识常用的标签。

老师告诉你能学到什么？: 1. 理解JavaScript基础语法； 2. 掌握常用语句的使用方法； 3. 学会如何获取DOM元素及进行简单操作。

微信扫码，参与3人拼团

热搜

最近搜索清空

JavaScript入门篇

改变 HTML 样式

任务

innerHTML 属性

任务

JavaScript-打开新窗口（window.open）