菜鸟学习javascript实例教程(13)

2008-02-23 07:41:41来源:互联网 阅读 ()

新老客户大回馈,云服务器低至5折


</body>

</html>


返回所选列表的文本值

<html>
<head>
<script type="text/javascript">
function getText()
{
var x=document.getElementById("mySelect")
alert(x.options[x.selectedIndex].text)
}
</script>
</head>

<body>
<form>
Select your favorite fruit:
<select id="mySelect">
<option>Apple</option>
<option>Orange</option>
<option>Pineapple</option>
<option>Banana</option>
</select>
<br /><br />
<input type="button" onclick="getText()" value="Show text of selected fruit">
</form>
</body>

</html>


删除列表的项目

<html>
<head>
<script type="text/javascript">
function formAction()
{
var x=document.getElementById("mySelect")
x.remove(x.selectedIndex)
}
</script>
</head>

<body>
<form>
<select name="mySelect">
<option>Apple</option>
<option>Banana</option>
<option>Orange</option>
</select>
<input type="button" onclick="formAction()" value="Remove option">
</form>
</body>

</html>


显示屏幕的信息

<html>
<body>
<script type="text/javascript">
document.write("Screen resolution: ")
document.write(screen.width "*" screen.height)
document.write("<br />")
document.write("Available view area: ")
document.write(screen.availWidth "*" screen.availHeight)
document.write("<br />")
document.write("Color depth: ")
document.write(screen.colorDepth)
document.write("<br />")
</script>
</body>
</html>


表格对象

改变表格的边框

<html>
<head>
<script type="text/javascript">
function changeBorder()
{
document.getElementById('myTable').border="10"
}
</script>
</head>

<body>
<table border="1" id="myTable">
<tr>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>300</td>
<td>400</td>
</tr>
</table>
<form>
<input type="button" onclick="changeBorder()" value="Change Border">
</form>
</body>

</html>


改变表格的间距

<html>
<head>
<script type="text/javascript">
function padding()
{
document.getElementById('myTable').cellPadding="15"
}
function spacing()
{
document.getElementById('myTable').cellSpacing="15"
}
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>300</td>
<td>400</td>
</tr>
</table>
<form>
<input type="button" onclick="padding()" value="Change Cellpadding">
<input type="button"

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:网页制作中表单相关特效整理

下一篇:使用Javascript创建XML文件