1、设计思路

（1）第一种是直接在JavaScript中定义

（2）第二种是利用函数

（3）第三种是利用函数，优化功能，提高可重用性

2、源码


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>计算三角形面积</title>
<script type="text/javascript">
    //三角形的宽度
    var width = window.prompt("请输入三角形的宽！","");
	//三角形的高度
	var height = window.prompt("请输入三角形的高！","");
	//三角形的面积
	var area = (width*height)/2;
	if(!isNaN(area))
	{
		alert("三角形的面积："+area);
	}else{
		alert("您输入有误！");
	}
	
	/**
	计算三角形面积
	*/
	function calTriangle()
	{
		 //三角形的宽度
		var width = window.prompt("请输入三角形的宽！","");
		//三角形的高度
		var height = window.prompt("请输入三角形的高！","");
		//三角形的面积
		var area = (width*height)/2;
		if(!isNaN(area))
		{
			alert("三角形的面积："+area);
		}else{
			alert("您输入有误！");
		}
	}
	
	/**
	计算三角形面积
	*/
	function calArea(width,height)
	{
		return width*height/2;
	}
	
	 //三角形的宽度
    var w = window.prompt("输入三角形的宽！","");
	//三角形的高度
	var h = window.prompt("输入三角形的高！","");
	
	document.write(calArea(w,h));
	
</script>
</head>

<body>
   <div id="div_btn" style="text-align:center; font-size:16px;">
      <input type="button" οnclick="calTriangle()" value="计算"/>
   </div>
</body>
</html>


3、结果如下

（1）第一种方法

javascript计算三角形面积 js求三角形面积_三角形面积

javascript计算三角形面积 js求三角形面积_javascript_02

javascript计算三角形面积 js求三角形面积_html_03

（2）第二种

javascript计算三角形面积 js求三角形面积_html_04

javascript计算三角形面积 js求三角形面积_xhtml_05

javascript计算三角形面积 js求三角形面积_xhtml_06

（3）第三种

javascript计算三角形面积 js求三角形面积_ViewUI_07

javascript计算三角形面积 js求三角形面积_三角形面积_08

javascript计算三角形面积 js求三角形面积_html_09