JS入门/基本语法和属性(免费)

JS入门/基本语法和属性(免费) 扫二维码继续学习

vip

实例:

需求:

1、点击按钮,按钮背景色变成黄色。

2、点击页面中按钮,改变div的宽度高度。

分析:

1、页面中需要有的元素有:按钮、DIV

2、通过ID获取页面中的元素:document.getElemengById('ID名称')

3、给元素添加事件处理:元素.onclick=function(){  代码段 };

4、改变元素的样式,行间中操作:

元素.style.样式名=值

5、window.onload

 

[展开全文]

JS 的位置  

1.行间js

 

[展开全文]

驱蚊器无

 

[展开全文]

console.log()

 

dsafdsakfasfhjk

[展开全文]
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			#box{
				width: 100px;
				height: 100px;
				border: 1px solid #FF0000;
				display: block;
			}
		</style>
		<script>
			window.onload=function(){
				var btn=document.getElementById('btn');
				var box=document.getElementById('box');
				var on='block';
				btn.onclick=function(){
					if(on=='none'){
						box.style.display='block';
						on='block';
					}else{
						box.style.display="none";
						on='none';
					}
				}
			}
		</script>
	</head>
	<body>
		<input type="button" id="btn" value="按钮" />
		<div id="box"></div>
	</body>
</html>

 

[展开全文]

变量命名规则:

1、允许字母、数字、下划线(_)、美元符($) 任意组合而成;

2、不允许数字开头

3、不允许使用关键字和保留字

关键字:当前语法中正在使用的单词

保留字:将来可能在语法中使用的单词

 

变量命名风格:

1、语义化

2、驼峰命名

大驼峰:首字母就大写

小驼峰:从第二个单词开始首字母大写,比如getElementById

[展开全文]

页面的代码一般是从上到下,从左到右的加载

 

script标签放在head标签里,当js代码需要获取页面中的元素的时候,这时候js代码放在元素的前面,需要加    window.onload=function(){}

[展开全文]
无瑕疵 · 2017-02-10 · 3-window.onload 0

选项卡

 

[展开全文]

1 样式里的注释为“/*注释内容*/”,例如:

    <stype>

.box{width: 100px;}

/*注释内容*/

    </stype>

2 js里的注释有两种:

   a.//注释内容     //单行注释

   b./*注释内容*/      //多行注释

[展开全文]

js出现的位置:

行间

内嵌

外链js文件

[展开全文]
流年 · 2017-01-11 · 1-初识JavaScript 0

1   js的位置和css一样,分为行间丶内嵌丶外链。

2   外链时用<script src=""></script>引入外部文件。(css的外链则在<head></dead>间写<link rel="stylesheet" href="文件名.css" type="text/css">)

 

[展开全文]

满足不了我们的需求,给一个自己添加的属性,

 

 

 

[展开全文]
ICFly · 2016-11-30 · 34-自定义属性 0

javaScript的组成:

ECMAScript(5.1):javaScript组成的语法和基本对象

DOM:文档对象模型,描述处理网页内容的方法盒接口

BOM:浏览器对象模型,描述与浏览器进行交互的方法和接口

javaScript特点:

跨平台的web脚本语言

向html页面添加交互行为

与服务器进行通信

[展开全文]

input type="button" id="btn" value="按钮"/

[展开全文]
yjh001 · 2016-10-28 · 1-初识JavaScript 0

1、JavaScript组成

  • ECMAScript
  • DOM
  • BOM

 

2、JavaScript的特点

  • 跨平台的web脚本语言
  • 向html页面添加交互行为
  • 可与服务器进行通信
[展开全文]
fprint · 2016-09-16 · 1-初识JavaScript 0

  需求:

    点击按钮显示对应的div,让其它的按钮背景色去掉,让其他的div都隐藏。

  关键点:

    /*如何取得上一个点击的input.

 分析

  1.获取到所有的按钮以及div

  2.给每一个按钮添加事件。

     1.把上一个点击的按钮背景色去掉。

     2.把上一个点击的按钮对应的DIV,让他隐藏

     3.给当前点击事件的按钮对应的div,让他显示。

*/

/*

  每一个按钮度对应一个div,他们的下标值都是相同的。

  如果取到一个下标值,那就能找到对应的按钮与div.

*/

[展开全文]
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script src="js/util.js"></script>
		<script>
		window.onload = function () {
			var lis = document.querySelectorAll('.menu>li');
			for (var i = 0; i < lis.length; i++) {
				lis[i].onclick = function () {
					if (this.style.backgroundColor !== 'lightblue') {
						this.style.backgroundColor = 'lightblue'; // 淡蓝色
					} else {
						this.style.backgroundColor = '#FFF'; // 白色
					}
				}
			}
		}
		</script>
	</head>
	<body>
		<ul class="menu">
			<li>11</li>
			<li>12</li>
			<li>13</li>
			<li>14</li>
			<li>15</li>
		</ul>
	</body>
</html>

 

[展开全文]
zhangbao · 2016-09-07 · 33-this 0

授课教师

金牌讲师

学员动态