15158846557 在线咨询 在线咨询
15158846557 在线咨询
所在位置: 首页 > 营销资讯 > 网站运营 > 慕课网js入门笔记

慕课网js入门笔记

时间:2023-06-07 14:21:01 | 来源:网站运营

时间:2023-06-07 14:21:01 来源:网站运营

慕课网js入门笔记:

document对象

document.write("hello");document.getElementById("p1").style.color="blue";





html中插入js代码

<script type="text/javascript"> document.write("开启JS之旅!");//js语句</script>





js代码外链

在html文件中写:

<script src="script.js"></script>在script.js文件中直接写js代码







js代码位置

我们可以将JavaScript代码放在html文件中任何位置,但是我们一般放在网页的head或者body部分。 放在head部分 最常用的方式是在页面中head部分放置<script>元素,浏览器解析head部分就会执行这个代码,然后才解析页面的其余部分。 放在body部分 JavaScript代码在网页读取到该语句的时候就会执行。







注意: javascript作为一种脚本语言可以放在html页面中任何位置,但是浏览器解释html时是按先后顺序的,所以前面的script就先被执行。比如进行页面显示初始化的js必须放在head里面,因为初始化都要求提前进行(如给页面body设置css等);而如果是通过事件调用执行的function那么对位置没什么要求的。







每一句JavaScript代码格式:语句;

先来看看下面代码

<script type="text/javascript"> alert("hello!");</script>例子中的alert("hello!");就是一个JavaScript语句。

一行的结束就被认定为语句的结束,通常在结尾加上一个分号";"来表示语句的结束。







单行注释,在注释内容前加符号 “//”。

<script type="text/javascript"> document.write("单行注释使用'//'"); // 我是注释,该语句功能在网页中输出内容</script>多行注释以"/*"开始,以"*/"结束。

<script type="text/javascript"> document.write("多行注释使用/*注释内容*/"); /* 多行注释 养成书写注释的良好习惯 */</script>





变量名可以任意取名,但要遵循命名规则:

1.变量必须使用字母、下划线(_)或者美元符($)开始。

2.然后可以使用任意多个英文字母、数字、下划线(_)或者美元符($)组成。

3.不能使用JavaScript关键词与JavaScript保留字。







语法

if(条件){ 条件成立时执行的代码 }else{ 条件不成立时执行的代码 }假设我们通过年龄来判断是否为成年人,如年龄大于等于18岁,是成年人,否则不是成年人。代码表示如下**:**

<script type="text/javascript"> var myage = 18; if(myage>=18) //myage>=18是判断条件 { document.write("你是成年人。");} else //否则年龄小于18 { document.write("未满18岁,你不是成年人。");}</script>





函数

函数是完成某个特定功能的一组语句。如没有函数,完成任务可能需要五行、十行、甚至更多的代码。这时我们就可以把完成特定功能的代码块放到一个函数里,直接调用这个函数,就省重复输入大量代码的麻烦。

如何定义一个函数呢?基本语法如下:

function 函数名(){ 函数代码;}说明:

  1. function定义函数的关键字。
  2. "函数名"你为函数取的名字。
  3. "函数代码"替换为完成特定功能的代码。
我们来编写一个实现两数相加的简单函数,并给函数起个有意义的名字:“add2”,代码如下:

function add2(){ var sum = 3 + 2; alert(sum);}函数调用:

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













document.write()

<script type="text/javascript"> var a = 'hello'; document.write(a+"<br>"); document.write('world');</script>





警告弹窗

alert("字符串"); alert(变量名);例如

<script type="text/javascript"> alert("警告"); alert("第二条警告");</script>





confirm消息对话框

confirm 消息对话框通常用于允许用户做选择的动作,如:“你对吗?”等。弹出对话框(包括一个确定按钮和一个取消按钮)。

语法:

confirm("str");参数说明:

str:在消息对话框中要显示的文本返回值: Boolean值返回值:

当用户点击"确定"按钮时,返回true当用户点击"取消"按钮时,返回false注: 通过返回值可以判断用户点击了什么按钮

看下面的代码:

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





prompt消息对话框

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

prompt(str1,str2);str1: 要显示在消息对话框中的文本不可修改str2文本框中的内容可以修改返回值:

1. 点击确定按钮,文本框中的内容将作为函数返回值2. 点击取消按钮,将返回nullvar myname = prompt("请输入姓名:");if(myname!=null) { alert("你好"+myname); }else { alert("你好我的朋友"); }





打开新窗口

window.open('URL','窗口名称','参数字符串');窗口名称可选参数被打开窗口的名称 1.该名称由字母数字和下划线字符组成 2."_top""_blank""_self"具有特殊意义的名称 _blank在新窗口显示目标网页 _self在当前窗口显示目标网页 _top框架网页中在上部窗口中显示目标网页 3.相同 name 的窗口只能创建一个要想创建多个窗口则 name 不能相同 4.name 不能包含有空格参数字符串可选参数设置窗口参数各参数用逗号隔开例如:打开http://www.imooc.com网站,大小为300px * 200px,无菜单,无工具栏,无状态栏,有滚动条窗口:

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





关闭窗口

window.close(); //关闭本窗口窗口对象.close();//关闭指定窗口例如<script style="text/javascript"> var newWindow = window.open('http://www.imooc.com'); newWindow.close();</script>注意:上面代码在打开新窗口的同时,关闭该窗口,看不到被打开的窗口。







DOM

获取id

document.getElementById("这里是id");var myId = document.getElementById("这里是id");document.write("id的标签是"+myId);





innerHTML属性

innerHTML 属性用于获取或替换 HTML 元素的内容。

语法:

Object.innerHTML





使用js改变html的样式

Object.style.属性 = new style;Object是通过document.getElementById("id")获取的元素对象





display属性

Object.stytle.display = value ;value : none不显示该元素 block以块元素显示





控制类名

Object.className = 类名 ;

关键词:入门,笔记

74
73
25
news

版权所有© 亿企邦 1997-2025 保留一切法律许可权利。

为了最佳展示效果,本站不支持IE9及以下版本的浏览器,建议您使用谷歌Chrome浏览器。 点击下载Chrome浏览器
关闭