JavaScript 運算符


運算子 = 用來賦值。

運算子 + 用於加值。

運算子 = 用來給 JavaScript 變數賦值。

算術運算子 + 用來把值加起來。

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>点击按钮计算 x 的值.</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction()
{
	y=5;
	z=2;
	x=y+z;
	document.getElementById("demo").innerHTML=x;
}
</script>

</body>
</html>

運行實例»

點擊"運行實例" 按鈕查看線上實例

JavaScript 算術運算子

加法：


##實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>假设 y=5，计算 x=y+2，并显示结果。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
	var y=5;
	var x=y+2;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x;
}
</script>

</body>
</html>

執行實例»點擊"運行實例" 按鈕查看線上實例

減法：

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 y=5, 计算出 x=y-2, 并输出结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var y=5;
	var x=y-2;
	var demoP=document.getElementById("demo");
	demoP.innerHTML="x=" + x;
}
</script>

</body>
</html>

執行實例»#點擊"運行實例" 按鈕查看線上實例

乘法：

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 y=5, 计算出 x=y*2, 并输出结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var y=5;
	var x=y*2;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x;
}
</script>

</body>
</html>

運行實例»##點擊"運行實例"按鈕查看線上實例

除法：

##實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 y=5, 计算 x=y/2, 并输出结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var y=5;
	var x=y/2;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x;
}
</script>

</body>
</html>

#執行實例»

點擊"運行實例"按鈕查看線上實例

取模（餘數）

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 y=5, 计算出 x=y%2, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var y=5;
	var x=y%2;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x;
}
</script>

</body>
</html>

運行實例»
##點擊"運行實例"按鈕查看線上實例

自增：

##實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 y=5, 计算出 x=++y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var y=5;
	var x=++y;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x + ", y=" + y;
}
</script>
<p><strong>注意:</strong>两个值 x 和 y 都受到影响。</p>
	
</body>
</html>

運行實例»

#點擊"運行實例" 按鈕查看線上實例

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 y=5, 计算出 x=y++, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var y=5;
	var x=y++;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x + ", y=" + y;
}
</script>
<p><strong>注意:</strong> x 和 y 两个值都受到影响。</p>
	
</body>
</html>

#執行實例»

點擊"運行實例" 按鈕查看線上實例

自減：

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 y=5, 计算出 x=--y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var y=5;
	var x=--y;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x + ", y=" + y;
}
</script>
<p><strong>注意:</strong> x 和 y 两个值都会被影响。</p>
	
</body>
</html>


運行實例»

點擊"運行實例"按鈕查看線上實例

#實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 y=5, 计算出 x=y--, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var y=5;
	var x=y--;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x + ", y=" + y;
}
</script>
<p><strong>注意：</strong>x 和 y 两个值都会受到影响。</p>
	
</body>
</html>

執行實例»

點擊"執行實例"按鈕查看線上實例

JavaScript 賦值運算子

賦值運算子用於為JavaScript 變數賦值。

給定x=10 和y=5，下面的表格解釋了賦值運算子：

=：

##實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 x=10 和 y=5, 计算 x=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var x=10;
	var y=5;
	x=y;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x;
}
</script>

</body>
</html>

執行實例»點擊"運行實例" 按鈕查看線上實例

+=：

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 x=10 和 y=5, 计算 x+=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var x=10;
	var y=5;
	x+=y;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x;
}
</script>

</body>
</html>

執行實例»點擊"運行實例" 按鈕查看線上實例

-=：

#實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 x=10 和 y=5, 计算 x-=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var x=10;
	var y=5;
	x-=y;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x;
}
</script>

</body>
</html>


執行實例»

點擊"運行實例" 按鈕查看線上實例

*=：

實例
<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 x=10 和 y=5, 计算 x*=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var x=10;
	var y=5;
	x*=y;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x;
}
</script>

</body>
</html>

運行實例»

#點擊"運行實例" 按鈕查看線上實例

/=：

實例
<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 x=10 和 y=5, 计算 x/=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var x=10;
	var y=5;
	x/=y;
	var demoP=document.getElementById("demo");
	demoP.innerHTML="x=" + x;
}
</script>

</body>
</html>

運行實例»

點擊"運行實例" 按鈕查看線上實例

%=：

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>设置 x=10 和 y=5, 计算 x%=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var x=10;
	var y=5;
	x%=y;
	var demoP=document.getElementById("demo")
	demoP.innerHTML="x=" + x;
}
</script>

</body>
</html>

運行實例»

點擊"運行實例" 按鈕查看線上實例


#用於字串的+ 運算子

## #####+ 運算子用於把文字值或字串變數加起來（連接起來）。 ######如需把兩個或多個字串變數連接起來，請使用 + 運算子。 #########實例######
<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>点击按钮创建及增加字符串变量。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction()
{
	txt1="What a very";
	txt2="nice day";
	txt3=txt1+txt2;
	document.getElementById("demo").innerHTML=txt3;
}
</script>

</body>
</html>
#########執行實例 »######點擊 "執行實例" 按鈕查看線上實例######

要想在兩個字串之間增加空格，需要把空格插入一個字串之中：

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>点击按钮创建及增加字符串变量。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction()
{
	txt1="What a very ";
	txt2="nice day";
	txt3=txt1+txt2;
	document.getElementById("demo").innerHTML=txt3;
}
</script>

</body>
</html>

# #運行實例»點擊"運行實例" 按鈕查看線上實例

或把空格插入表達式中：

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>点击按钮创建及增加字符串变量。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction()
{
	txt1="What a very";
	txt2="nice day";
	txt3=txt1+" "+txt2;
	document.getElementById("demo").innerHTML=txt3;
}
</script>

</body>
</html>

運行實例»點擊"運行實例"按鈕查看在線實例

對字符字串和數字進行加法運算

兩個數字相加，傳回數字相加的和，如果數字與字串相加，傳回字串，如下實例：

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>点击按钮创建及增加字符串变量。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction()
{
	var x=5+5;
	var y="5"+5;
	var z="Hello"+5;
	var demoP=document.getElementById("demo");
	demoP.innerHTML=x + "<br>" + y + "<br>" + z;
}
</script>

</body>
</html>

運行實例»點擊"運行實例" 按鈕查看線上實例

規則:如果把數字與字串相加，結果就會變成字串！