JavaScript入门

最新推荐文章于 2024-05-30 11:27:58 发布
最新推荐文章于 2024-05-30 11:27:58 发布
阅读量73 收藏
点赞数
分类专栏： web前端 文章标签： javascript html css ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/chinrui/article/details/88303379
版权
[align=center][b]Javascript是一种弱类型的语言[/b][/align]
在网页中嵌入javascript脚本的基本格式： 
<script type="text/javascript>
	var y = 3;
	alert(y);
</script>

在网页上打印结果，并用html设置文字的属性： 
var sum = "";
	for(var x=0; x<4; x++) {
		if(x==3) {
			sum = sum + "x=" + x;
		}
		else {
			sum = sum + "x=" + x + ",";
		}
	}
	document.write("<font color=red>" + sum + "</font>");

使用表格将javascript运行的结果在网页上展示： 
document.write("<table>");
for(var x=1; x<=9; x++) {
	document.write("<tr>");
	for(var y=1; y<=x; y++) {
		document.write("<th>" + x+"*"+y+"="+(x*y) + "</th>");
	}
	document.write("</tr>");
}
document.write("</table>");

对数组进行排序并输出： 
var arr = [2,4,6,5,234,65,42];

	for(var x=0; x<arr.length-1; x++) {
		for(var y=x+1; y<arr.length; y++) {
			if(arr[x]<arr[y]) {
				var temp = arr[x];
				arr[x] = arr[y];
				arr[y] = temp;
			}
		}
	}
	for(var x=0; x<arr.length; x++) {
		document.write(arr[x] + "   ");
	}

在javascript定义函数，并进行调用： 
var arr = [2,4,6,5,234,65,42];
	function show(arr) {
		for(var x=0; x<arr.length-1; x++) {
			for(var y=x+1; y<arr.length; y++) {
				if(arr[x]<arr[y]) {
					var temp = arr[x];
					arr[x] = arr[y];
					arr[y] = temp;
				}
			}
		}
	}
	show(arr);
	function output(arr) {
		for(var x=0; x<arr.length; x++) {
			document.write(arr[x] + "   ");
		}
	}
	output(arr);

在javascript中，即使函数中没有参数，也可以在调用的时候输入参数，方法能够正常的运行，因此，javascript没有方法的重载(arguments为存取输入参数的一个数组)： 
function show() {
		for(var x=0; x<arguments.length; x++) {
			document.write(arguments[x] + " ");
		}
	}
	show(2,3,3,5);

在javascript中，方法就是一个对象，可以new新的方法对象(下面是一个匿名方法的实例化，x,y为方法的参数，其余的方法体)： 
var show = new Function("x","y","var sum=x+y;return sum;");
var sum = show(5,7);
alert(sum);

对象的定义及对象的引用： 
function Person(name,age) {
	this.name = name;
	this.age = age;
}
var p = new Person("lisi", 90);
alert(p.name + "..." + p.age);
alert(p["name"] + "..." + p.age);

在js中存入javascript代码，方便引用： 
function ArrayTool(){}
var ArrayTool = new ArrayTool();

function max(arr) {
	var max = arr[0];
	for(var x=0; x<arr.length; x++) {
		if(arr[x] > max) {
			max = arr[x];
		}
	}
	return max;
}
ArrayTool.getMax = max;

方法的引用： 
<script type="text/javascript" src="arraytool.js"></script>
  <script type="text/javascript">
	var arr = [2,5,5,6,39,21,31,34,31,23];
	var a = ArrayTool.getMax(arr);
	alert("max:" + a);
  </script>

在javascript语句中，调用with语句，就可以使用里面对象的所有对象和方法： 
function Student(name,age) {
			this.name = name;
			this.age = age;
	  }

	  var stu = new Student("zhaoliu",30);
	  with(stu) {
		alert(name + "...." + age);
	  }

在javascript语句里面使用for…in语句，可以遍历对象里面的属性： 
function Student(name,age) {
			this.name = name;
			this.age = age;
	  }
	  var stu = new Student("zhaoliu",30);
	 /* for(s in stu) {
		document.write(s);
	  }*/
for(s in stu) {
		document.write(s+":"+stu[s]+" ");
	  }

用for…in语句遍历数组： 
var arr = [2,4,5,1];

	for(x in arr) {
	document.write(arr[x] + " ");
	}

使用String中的charAt()的方法： 
var str = "abcda";
 var x = str.charAt(1);
 alert(x);

使用String中的bold()方法，对字符串进行加粗：
var y = str.bold();
document.write(y);
使用String中的fontcolor()设置文字的颜色：
var z = str.fontcolor("red");
使用String中的link()方法，建立超链接：
var c = str.link("http://www.baidu.com");
使用String中的substr方法，取第start到end的字符(不包括end)：
var b = str.substring(2,4);
使用String中的substring方法，取start开始共length的字符：
var a = str.substr(2,4);
在javascript中取字符串的长度用的是属性length
使用Math里面的random()产生随机数： 
for(var x=0; x<10; x++) {
	var d = Math.random()*10 + 1;

	document.write(d+"<br/>");
 }

使用parseInt()方法，转化为整数：
var d = parseInt(Math.random()*10 + 1);
使用parseInt()转化格式时，第二个参数为转化的进制位：
var num = parseInt("1a",16);
document.write("num=" + num);
使用toString()转化进制：
var num = parseInt("1a",16);
document.write("num=" + num);
使用javascript中的日期类： 
var d = new Date();
	with(d) {
		document.write(getYear()+ "年"+(getMonth()+1)+"月"+getDate()+"日 星期"+ getDay());
	}

给语言里面的数组对象添加自定义的方法： 
 function getMax() {
		var max = this[0];
		for(var x=0;x<this.length;x++) {
			if(this[x]>max) {
				max = this[x];
			}
		}
		return max;
	 }
	 Array.prototype.getMax = getMax;
	 var arr = [4,1,5,6,2];
	 var max = arr.getMax();
	 document.write(max);

DOM：document object model 文档对象模型
Dom三层模型：
Dom1:将html文档封装成对象。
Dom2:将xml文档封装成对象。
Dom3:将xml文档封装成对象。
Dhtml:动态html。相关技术:html css dom javascript
Html:将数据进行封装
Dom:将标签封装成对象
Css:负责标签中的数据的样式
Javascript:将三个进行融合，通过程序设计方式来完成动态效果的操作
标签之间存在着层次关系：
Html
|--head
|--title
|--base
|--link
|--meta
|--style
|--script
|--body
|--div
|--form
|--input
|--select
|--span
|--a
|--table
|--tbody
|--tr
|--td
|--th
|--dl
|--dt
|--dd
Html标签： 
<input type="button" value="演示" onclick="demo()" />
  <div id="divid">
	ajsldfka;ldfka
  </div>

写入javascript的响应程序： 
<script type="text/javascript">
  function demo() {
	var divObj = document.getElementById("divid");
获得对象的名字、类型和值；
	var name = divObj.nodeName;
	var type = divObj.nodeType;
	var value = divObj.nodeValue;
	document.write(name+"..."+type+"..."+value);
	divObj.style.backgroundColor = "red";
  }
</script>

节点类型：
标签型节点：类型：1
属性节点：类型：2
文本型节点：类型：3
注释型节点：类型：8
******获取节点可以通过节点的层次关系获得，也可以通过document进行获取getElementById/getElementByName/getElementsByTagName
//获取父节点
var parent = divObj.parentNode;
getNodeInfo(parent);

//获取子结点
var childs = divObj.childNodes;
document.write(childs.length);
}
//获取兄弟节点
//获取上一个节点
var preNode = divObj.previousSibling.previousSibling;
getNodeInfo(preNode);
}
//获取下一个节点
var nextNode = divObj.nextSibling;
getNodeInfo(nextNode);
//需要求获取a标签的文本
var aNode = divObj.nextSibling.nextSibling;
var aNext = aNode.childNodes[0];
getNodeInfo(aNext);
******标签之间存在空行时，会出现一个空白的文本节点，在获取节点时一定要注意。
另外一个获取节点的方法：
//获取单元格一文本 
var tableNode = divObj.nextSibling;
	var tdNodes = tableNode.getElementsByTagName("td");
	document.write(tdNodes[0].innerText);
	//通过标签获取层次关系
	var str = "";
	function listNode(node,level) {
		printInfo(node,level);
		level++;
		var nodes = node.childNodes;
		for(var x=0; x<nodes.length; x++) {
			if(nodes[x].hasChildNodes())
				listNode(nodes[x],level);
			else
				printInfo(nodes[x],level);

		}
	}
	function getSpace(level) {
		var s = "";
		for(var x=0; x<level;x++) {
			s += "|----";
		}
		return s;
	}
	function printInfo(node,level) {
		str += getSpace(level)+"name:"+node.nodeName+"...type:"+node.nodeType+"..value:"+node.nodeValue+"<br/>";
	}
	function getNodes() {
		listNode(document,0);
		document.write(str);
	}
	//获得属性节点
	function getAtts() {
		var q = "";
		var divObj = document.getElementById("divid");
		var atts = divObj.attributes;
		for(var x=0; x<atts.length; x++) {
			q += atts[x].nodeName+"...type:"+atts[x].nodeType+"..value:"+atts[x].nodeValue+"<br/>";
		}
		document.write(q);
	}

<!--
 1.定义数据封装的标签
 2.确定事件源
 3.注册事件
 4.事件处理


 需求：
 页面中有一个新闻区域
 通过超链接
 可以让用户改变区域的字体大小
 -->
<head>
  <title> New Document </title>

  <script type="text/javascript">
	function changeSize(size) {
		var divNode = document.getElementById("newsid");
		divNode.style.fontSize = size;
	}
  </script>
 </head>
<body>
<h2>新闻标题</h2>
 <a href="javascript:void(0)" onclick="changeSize('24px')">大</a>
 <a href="javascript:void(0)" onclick="changeSize('16px')">中</a>
 <a href="javascript:void(0)" onclick="changeSize('10px')">小</a><br/>
 <div id="newsid">
 叶落归根发酵饲料大跃进福建喱；朝思暮想大跃进<br/>
 叶落归根发酵饲料大跃进福建喱；朝思暮想大跃进<br/>
</div>
 </body>
上面代码优化：
  <script type="text/javascript">
	function changeSize(className) {
		var divNode = document.getElementById("newsid");
		divNode.className = className;
	}
  </script>
  <style type="text/css">
	.max {
		background-color:red;
		color:gray;
		font-size:24px;
	}
	.min {
		background-color:green;
		color:blue;
		font-size:10px;
	}
  </style>
<a href="javascript:void(0)" onclick="changeSize('max')">大</a>
<a href="javascript:void(0)" onclick="changeSize('min')">小</a>

 <!--
  需求：通过点击实现一个展开闭合效果。
  -->
<script type="text/javascript">
	var b = true;
	function change() {
		var divNode = document.getElementsByTagName("div")[0];
		if(divNode.className=="close") {
			divNode.className = "open"
		}
		else {
			divNode.className = "close";
		}
	}
</script>
<style type="text/css">
	.open {
		height:8px;
		overflow:visible;
	}
	.close {
		height:8px;
		overflow:hidden;
	}
</style>
<body>
  <div onclick="change()">
  叶落归根期刊两岸三地
  </div>
 </body>

获取事件源对象的两种方式：
1、 通过event对象的srcElement属性。
2、 将事件源对象通过this传入。
******以下代码效果：打开一个列表的时候，其余列表关闭。（通过event对象的srcElement属性） 
<script type="text/javascript">
	function list() {
		var dtNode = event.srcElement;
		var dtNodes = document.getElementsByTagName("dt");
		for(var i=0;i<dtNodes.length;i++) {
			if(dtNodes[i]==dtNode) {
				var dlNode = dtNode.parentNode;
				if(dlNode.className=="open") {
					dlNode.className="close";
				}
				else {
					dlNode.className="open";
				}
			}
			else
				dtNodes[i].parentNode.className="close";
		}
	}
</script>
<style type="text/css">
	.open {
		overflow:visible;
	}
	.close {
		overflow:hidden;
	}
	dl{
		overflow:hidden;
		height:14px;
	}
</style>

在网页上动态地打开和关闭（将事件源通过this传入）： 
<head>
  <style type="text/css">
	table {
		border:#0066FF 1px solid;
	}
	table td {
		background-color:gray;
		border:#0000FF 1px solid;
	}
	table td div {
		background-color:#66FFCC;
		display:none;
	}
	table td a {
		text-decoration:none;
		color:#993300;
	}
	.open {
		display:block;
	}
	.close {
		display:none;
	}
  </style>
  <script type="text/javascript">
	function list(aNode) {
		var tdNode = aNode.parentNode;
		var divNode = tdNode.getElementsByTagName("div")[0];
		var tableNode = document.getElementsByTagName("table")[0];
		var divNodes = tableNode.getElementsByTagName("div");
		for(var i=0;i<divNodes.length;i++) {
			if(divNodes[i]==divNode) {
				if(divNode.className=="open") {
					divNode.className="close";
				}
				else {
					divNode.className="open";
				}
			}
			else 
				divNodes[i].className = "close";
		}
	}
  </script>
 </head>
 <body>
	<table>
	<tr>
		<td>
			<a href="javascript:void(0)" onclick="list(this)">学习成绩</a>
			<div>
			你是我的<br/>
			你是我的<br/>
			你是我的<br/>
			你是我的<br/>
			</div>
		</td>
	</tr>
	</table>
 </body>

<!--
通过页面的按钮可以动态的创建一个表格和删除表格的行列。
-->
<head>
 <script type="text/javascript">
	 function createTable_1() {
		var tableNode = document.createElement("table");
		var tbodyNode = document.createElement("tbody");
		var trNode = document.createElement("tr");
		var tdNode = document.createElement("td");
		var divNode = document.getElementsByTagName("div")[0];
		divNode.appendChild(tableNode);
		tableNode.appendChild(tbodyNode);
		tbodyNode.appendChild(trNode);
		trNode.appendChild(tdNode);
		tdNode.innerText="你是我的";
	 }
	 function createTable() {
		var tableNode = document.createElement("table");
		tableNode.setAttribute("id","tabid");
		var row = document.getElementsByName("rownum")[0].value;
		var col = document.getElementsByName("colnum")[0].value;
		for(var i=1;i<=row;i++) {
			var trNode = tableNode.insertRow();
			for(var j=1;j<=col;j++) {
				var tdNode = trNode.insertCell();
				tdNode.innerHTML = i+"..."+j;
			}
		}
		var divNode = document.getElementsByTagName("div")[0];
		divNode.appendChild(tableNode);
		event.srcElement.disabled=true;
	 }
	 function delrow() {
		var tableNode = document.getElementById("tabid");
		var row = tableNode.rows;
		var delrow = document.getElementsByName("delrow")[0].value;
		if(tableNode==null) {
			alert("表格不存在");
			return;
		}
		if(delrow>0 && delrow<=row.length)
			tableNode.deleteRow(delrow - 1);
		else
			alert("删除的行不存在");
	 }
	 function delcol() {
		 var tableNode = document.getElementById("tabid");
		 var delcol = document.getElementsByName("delcol")[0].value;
		 if(tableNode==null) {
			alert("Table Not Exists!");
			return;
		 }
		 if(delcol>0 && delcol<=tableNode.rows[0].cells.length) {
			for(var i=0;i<tableNode.rows.length;i++) {
				tableNode.rows[i].deleteCell(delcol-1);
			}
		 }
		 else
			alert("Deleted Col Not Exists");
	 }
 </script>
 <style type="text/css">
	table {
		border:red 1px solid;
		width:60%;
		height:20px;
	}
	table td {
		border:red 1px solid;
	}
 </style>
 </head>
 <body>
	 <input type="text" name="rownum" />
	 <input type="text" name="colnum" /><br />
	 <input type="button" value="创建表格" onclick="createTable()" /><br/>
	 <input type="text" name="delrow" />
	 <input type="button" value="删除行" onclick="delrow()" /><br/>
	 <input type="text" name="delcol" />
	 <input type="button" value="删除列" onclick="delcol()" />
	 <div>
	 </div>
 </body>

<!--对网页中表格的数据进行排序-->
<head>
 <style type="text/css">
	 table,table th,table td {
		border:red 1px solid;
	 }
	 table {
		width:60%;
	 }
	 table th {
		background-color:gray;
	 }
 </style>
 <script type="text/javascript">
 function sortTab() {
	var tableNode = document.getElementsByTagName("table")[0];
	var trs = tableNode.rows;
	var arr = new Array();
	for(var i=1;i<trs.length;i++) {
		arr[i-1] = trs[i];
	}
	sortt(arr);
	var tbodyNode = tableNode.childNodes[0];
	if(disgush == true) {
		for(var i=0;i<arr.length;i++) {
			tbodyNode.appendChild(arr[i]);
		}
		disgush = false;
	} else {
		for(var i=arr.length;i>0;i--) {
			tbodyNode.appendChild(arr[i-1]);
		}
		disgush = true;
	}
 }
 var disgush = true;
 function sortt(arr) {
	for(var i=0;i<arr.length-1;i++) {
		for(var j=i+1;j<arr.length;j++) {
			if(parseInt(arr[i].cells[1].innerText)>parseInt(arr[j].cells[1].innerText)) {
				var temp = arr[i];
				arr[i] = arr[j];
				arr[j] = temp;
			}
		}
	}
 }
 </script>
 </head>
 <body>
 <table>
	 <tr>
		<th>姓名</th>
		<th><a href="javascript:void(0)" onclick="sortTab()">年龄</a></th>
		<th>地址</th>
	 </tr>
</table>  
 </body>

<!--行间隔颜色显示，高亮颜色显示-->
<head>
 <style type="text/css">
	 table,table th,table td {
		border:red 1px solid;
	 }
	 table {
		width:60%;
	 }
	 table th {
		background-color:gray;
	 }
	 .one {
		background-color:#33FFCC;
	 }
	 .two {
		background-color:#FFFF66;
	 }
	 .over {
		background-color:#00FF00;
	 }
 </style>
 <script type="text/javascript">
	 function trColor() {
		var tableNode = document.getElementsByTagName("table")[0];
		var trs = tableNode.rows;
		for(var i=1;i<trs.length;i++) {
			if(i%2==1)
				trs[i].className = "one";
			else
				trs[i].className = "two";
			trs[i].onmouseover=function() {
				name = this.className;
				this.className = "over";
			};
			trs[i].onmouseout=function() {
				this.className = name;
			};
		}
	 }
	 var name;
	 window.onload=trColor;
 </script>
 </head>

<--购物时的多选-->
<head>
 <script type="text/javascript">
	function getSum() {
		var items = document.getElementsByName("item");
		var sum = 0;
		for(var i=0;i<items.length;i++) {
			if(items[i].checked)
				sum += parseInt(items[i].value);
		}
		var spanNode = document.getElementsByTagName("span")[0];
		var str = sum + "元";
		spanNode.innerHTML = str.fontsize(6);
	}
	function checkAll(all) {
		var items = document.getElementsByName("item");
		for(var i=0;i<items.length;i++) {
			items[i].checked = all.checked;
		}
	}
 </script>
 </head>
 <body>
  <input type="checkbox" name="all" onclick="checkAll(this)" />全选<br />
  <input type="checkbox" name="item" value=3000 />笔记本电脑:3000元<br />
  <input type="checkbox" name="all" onclick="checkAll(this)" />全选<br />
  <input type="button" value="总计费用" onclick="getSum()" /><span></span>
 </body>

制作css样式预览： 
<head>
<style type="text/css">
#cssid {
	height:100px;
	width:300px;
	background-color:#FFCC00;
}
#textid {
	background-color:#CCCCCC;
	width:300px;
}
</style>
<script type="text/javascript">
function change() {
	var selNode = document.getElementById("selid");
	var value = selNode.options(selNode.selectedIndex).value;
	var divNode1 = document.getElementById("cssid");
	var divNode2 = document.getElementById("textid");
	divNode1.style.textTransform = value;
	divNode2.innerText = "text-transform :" + value +";";
}
</script>
</head>
<body>
<div id="cssid">
	Good good study,Day day up!
</div><p></p>
<select id="selid" onchange="change()">
    <option value="none">--text--transform--</option>
    <option value="capitalize">首字母大写</option>
    <option value="uppercase">所有字母大写</option>
    <option value="lowercase">所有字母小写</option>
</select><p></p>
<div id="textid">
	text-transform : none;
</div>
</body>

<--制作一个简单的流氓广告--> 
<style type="text/css">
#bodyid {
	border:red 1px solid;
	height:800px;
	width:950px;
}
</style>
<script type="text/javascript">
var adNode = null;
function closead() {
	adNode.style.display = "none";
}
window.onload = function() {
	document.body.onmousemove = function() {
		adNode = document.getElementById("ad");
		adNode.style.left = event.x-20;
		adNode.style.top = event.y-20;
	}
}
</script>
</head>
<body>
<div id="ad" style="position:absolute;left:0;top:0;" onclick="closead()">
<a href="http://www.hao123.com" target="_blank"><img src="logo.jpg" /></a>
</div>
<div id="bodyid">body区域</div>
</body>

层叠选项卡（选择省份后出现相应的城市）： 
<script type="text/javascript">
function selCity() {
	var arr = [["--选择省份--"]
			  ,["海淀区","朝阳区","东城区","西城区"]
			  ,["沈阳","鞍山","大连","抚顺"]
			  ,["武汉","孝感","仙桃","天门"]
			  ,["郑州","焦作","开封","洛阳"]];
	var index = document.getElementById("selid").selectedIndex;
	//alert(document.getElementById("selid").options[index].innerText);
	var subNode = document.getElementById("subselid");
	var citys = arr[index];
	/*for(var x=0;x<subNode.options.length;) {
		subNode.removeChild(subNode.options[x]);
	}*/
	subNode.options.length = 0;
	for(var x=0;x<citys.length;x++) {
		var selOption = document.createElement("option");
		selOption.innerText = citys[x];
		subNode.appendChild(selOption);
	}
}
</script>
</head>
<body>
<select id="selid" onchange="selCity()">
	<option>--选择省份--</option>
	<option>北京</option>
    <option>辽宁</option>
    <option>湖北</option>
    <option>河南</option>
</select>
<select id="subselid">
	<option>--选择城市--</option>
</select>
</body>

<--添加和删除“添加附件”的表格-->
<style type="text/css">
table,table tr td {
	border:#33CC00 1px solid;
}
table td a:link,table td a:visited {
	text-decoration:none;
	color:#6633FF;
}
</style>
<script type="text/javascript">
var count = 1;
function addFile() {
	var tabNode = document.getElementsByTagName("table")[0];
	var trNode = tabNode.insertRow();
	trNode.id = "td_"+count;
	var tdNode_file = trNode.insertCell();
	var tdNode_del = trNode.insertCell();
	tdNode_file.innerHTML = "<input type='file' />";
	//tdNode_del.innerHTML = "<a href='javascript:void(0)' onclick='delRow("+count+")'>删除附件"+count+"</a>";
	tdNode_del.innerHTML = "<a href='javascript:void(0)' onclick='delRow(this)'>删除附件"+count+"</a>";
	count++;
}
function delRow(node) {
	var trNode = node.parentNode.parentNode;
	trNode.parentNode.removeChild(trNode);
	/*var trNode = document.getElementById("td_"+count);
	trNode.parentNode.removeChild(trNode);*/
	/*var tbdNode = document.getElementsByTagName("table")[0].childNodes[0];
	tbdNode.removeChild(trNode);*/
}
</script>
</head>
<body>
<table>
	<tr>
    	<td>
        <a href="javascript:void(0)" onclick="addFile()">添加附件</a>
        </td>
    </tr>
</table>
</body>

qchery
关注
专栏目录
JavaScript 入门
Robin Smith
03-05 778
学习目标： 提示： 督促自己学习JavaScript，自律会自由 学习的课程来自优达学城JavaScript入门 JavaScript入门学习目标：一、什么是JavaScript？二、数据类型和变量三、条件语句四、循环五、函数六、数组七、对象 一、什么是JavaScript？ 二、数据类型和变量 三、条件语句 四、循环 五、函数 六、数组 七、对象 ...
arcgis for JavaScript入门篇
qq_69444691的博客
07-10 2121
ArcGIS for JavaScript是一种基于Web的地图开发解决方案，由ESRI公司开发。它允许开发人员在Web应用程序中嵌入交互式地图，并使用JavaScript编写地图应用程序。ArcGIS for JavaScript提供了许多功能强大的API和工具，使开发人员能够创建高度定制的地图应用程序。它支持各种地图数据源，包括ESRI的ArcGIS Online服务、第三方地图服务、以及开发人员自己的数据。
前端之JavaScript入门篇
Queen_is_king的博客
07-26 2389
JavaScript是一门解释型语言，也是动态语言。所谓解释型值语言是指不需要被编译为机器码在执行，而是直接执行。由于少了编译这一步骤，所以解释型语言开发起来尤为轻松，但是解释型语言运行较慢也是它的劣势。不过解释型语言中使用了JIT技术，使得运行速度得以改善。而所谓的动态语言可以暂时理解为在语言中的一切内容都是不确定的。比如一个变量，这一时刻是个整型，下一时刻可能会变成字符串了。当然这个问题我们以后再谈。不过在补充一句动态语言相比静态语言性能上要差一些，不过由于JavaScript中应用的JIT技术提示。.
JavaScript入门教程
qq_69401634的博客
08-07 477
本文为JavaScript入门教程第一部分，包括JavaScript概述、JavaScript引用方法、JavaScript的数据类型和运算符、JavaScript的严格检查模式、函数、var，let，constructor、方法、内部对象、面向对象、操作BOM对象、操作DOM对象、jQuery基本语法等等......
超详细JavaScript入门基础+练手小案例
weixin_55643605的博客
10-28 2369
一.什么是JavaScript 它是一种浏览器解释型语言，嵌套在HTML文件中交给浏览器解释执行。主要用来实现网页的 动态效果，用户交互及前后端的数据传输等。 它由下列三部分组成： 1.核心语法：规范JavaScript的基本语法。 2.BOM：提供了一系列操作浏览器的方法。 3.DOM：提供了一系列操作文档的方法。 二.使用方法 将JavaScript嵌入页面有以下三种方式： 1.元素绑定事件 事件：指用户的行为（单击，双击等）。 事件处理：元素监听事件，并在事件发生后自动执行事件过程
JavaScript入门基础
『愚』的博客
11-06 3815
JavaScript入门基础概述变量的声明变量的作用域基本数据类型Number类型String类型Boolean类型Undefined类型Null类型三大引用类型Object类型Array类型Function类型typeof 操作符js编写的位置js的三种输出方式 概述 JavaScript是世界上最流行的脚本语言，是一种运行在浏览器中的解释型的编程语言，能够实现跨平台、跨浏览器。虽然只是十多天时间的产物，并且有很多的缺陷和陷阱，但也造就了JavaScript的灵活和强大。随着Node.js的兴起，Jav
【Web前端学习之路】JavaScript入门 （黑马课程学习笔记）
a123456_9的博客
04-26 1701
1、编程语言和标记语言的区别 编程语言有很强的逻辑和行为能力，通常是主动的指令，如：if、while等。 标记语言不用于向计算机发出指令，常用于格式化和链接，通常是被读取的。 2、JavaScript是什么 JavaScript是一种运行在客户端（自己的电脑）的脚本语言（脚本语言即不需要编译，运行过程由js解释器逐行来进行解释并执行的语言），现在可以基于Node.js技术进行服务器端编程。 3、浏览器执行JS简介 浏览器分为两个部分：①渲染引擎：解析HTML和CSS，俗称内核，比如chrome浏览
javascript 入门第一天
热门推荐
caozhisanguo的专栏
01-10 2万+
javascript 入门第一天
JavaScript 入门手册
SEO_juper的博客
01-15 1073
JavaScript (JS) 是一种编程语言，主要用于网页开发。它允许开发人员为网站添加交互性和动态行为。例如，您可以使用 JavaScript 创建可实时验证用户输入的交互式表单。用户一旦出错，错误信息就会立即弹出。就像这样JavaScript 还可用于启用手风琴等功能，以展开和折叠内容部分。下面是一个展开 "搜索引擎优化 "部分的示例：在上面的示例中，点击系列中的每个元素都会显示不同的内容。JavaScript 通过实时操作页面的 HTML 和 CSS 使之成为可能。
Javascript入门
10-18
Javascript简介 了解JavaScript的基本数据类型。 了解JavaScript的变量和常量。 使用JavaScript语言的一些注意事项 。
javascript入门总结
01-19
总结了javascript的重点内容，以及初学者容易犯错的地方。
JavaScript入门学习书籍推荐
10-30
对于许多想学习 JavaScript 的朋友来说，无疑如何选择入门的书籍是他们最头疼的问题，或许也是他们一直畏惧，甚至放弃学习 JavaScript 的理由。
`“use strict“`在JavaScript中是什么？它背后的原理是什么？
Jerry学长
05-27 1051
JavaScript的严格模式（strict mode）是ECMAScript 5引入的一项特性。如果你在脚本或函数的顶部声明 ，你就启用了严格模式： 当JavaScript引擎看到这个指令时，它将开始以一种特殊的模式解释代码。在这种模式下，当检测到某些可能导致潜在错误的编码实践时，会抛出错误。这就是严格模式背后的基本原理。考虑下面这个例子： 开发者可能因为强迫症而对齐数值字面量，但这样会无意中使变量 初始化为八进制字面量。在非严格模式下，这将被解释为值 （十进制）。然而，在严格模式下，这样的代码会抛出错
书籍学习|基于SprinBoot+vue的书籍学习平台(源码+数据库+文档)
JIngJaneIL的博客
05-28 1054
首先,论文一开始便是清楚的论述了平台的研究内容。其次,剖析平台需求分析,弄明白“做什么”,分析包括业务分析和业务流程的分析以及用例分析,更进一步明确平台的需求。然后在明白了平台的需求基础上需要进一步地设计平台,主要包罗软件架构模式、整体功能模块、数据库设计。本项目软件架构选择B/S模式和java技术，总体功能模块运用自顶向下的分层思想。再然后就是实现平台并进行代码编写实现功能。论文的最后章节总结一下自己完成本论文和开发本项目的心得和总结。通过书籍学习平台将会使书籍学习各个方面的工作效率带来实质性的提升。
Vue3实战笔记（52）—Vue 3封装持仓分析饼图
最新发布
山花的博客
05-30 226
接上文，封装持仓分析饼图。封装好几个组件，用于后续开发。把忧愁煮成茶，让它在心间慢慢沉淀，剩下的，便是清甜的回味。
Vue3 - 实现一个雨水滴落的动画效果
良月柒
05-29 139
在 Vue 3 中实现一个雨水滴落的动画效果，可以使用 HTML5 的元素和 JavaScript 来绘制和控制动画。
React后台管理（十三）-- 页面常用hook封装 --- useTable封装
weixin_43883615的博客
05-29 295
紧接上一篇，本篇主要讲和表格相关的全局hook函数封装。结构分析：（1）这个 useTable 钩子的功能是用于管理表格的高度（2）接受一个可选的 params 对象作为参数，可以包含 id 和 offset 两个属性（3）定义getHeight函数，实时计算表格区域高度，控制滚动区域下一篇讲【示例页面构建教学】。关注本栏目，将实时更新。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值