|
rameset rows="25%,*" frameborder="1">
<frame name="upperframe" src="frame_a.htm">
<frame name="lowerframe" src="frames_sourcepage.htm">
</frameset>
</html>
<html>
<head>
<script type="text/javascript">
function changeurl()
{
parent.upperframe.location.href="frame_b.htm"
parent.lowerframe.location.href="frame_c.htm"
}
</script>
</head>
<body>
<form>
<input type="button" onclick="changeurl()" value="Change url">
</form>
<p>Right-click inside the two frames and select "View Source" to see the source code.</p>
</body>
</html>
更新2个以上的页面
<html>
<frameset cols="70%,*" frameborder="1">
<frame src="frames_sourcepage2.htm">
<frameset rows="30%,*" frameborder="1">
<frame name="uframe" src="frame_a.htm">
<frame name="lframe" src="frame_b.htm">
</frameset>
</frameset>
</html>
<html>
<head>
<script type="text/javascript">
function changeurl()
{
parent.uframe.location.href="frame_c.htm"
parent.lframe.location.href="frame_d.htm"
}
</script>
</head>
<body>
<form>
<input type="button" value="Change url" onclick="changeurl()">
</form>
<p>Right-click inside the three frames and select "View Source" to see the source code.</p>
</body>
</html>
更新两个IFRAME
<html>
<head>
<script type="text/javascript">
function twoframes()
{
document.all("frame1").src="frame_c.htm"
document.all("frame2").src="frame_d.htm"
}
</script>
</head>
<body>
<iframe src="frame_a.htm" name="frame1"></iframe>
<iframe src="frame_b.htm" name="frame2"></iframe>
<br />
<form>
<input type="button" onclick="twoframes()" value="Change url of the two iframes">
</form>
</body>
</html>
图象对象
改变图象的高度
<html>
<head>
<script type="text/javascript">
function setHeight()
{
var x=document.images
x[0].height="250"
}
</script>
</head>
<body>
<img src="compman.gif" width="107" height="98" />
<form>
<input type="button" onclick="setHeight()" value="Change height of image">
</form>
</body>
</html>
改变图象
<html>
<head>
<script type="text/javascript">
function setSrc()
{
var x=document.images
x[0].src="hackanm.gif"
}
</script>
</head>
<body>
<img src="compman.gif" width="107" height="98" />
<form>
<input type="button" onclick="setSrc()" value="Change image">
</form>
</body>
</html>
改变图象的宽度
<html>
<head>
<script type="text/javascript">
function setWidth()
{
var x=document.images
x[0].width="300"
}
</script>
</head>
<body>
<img src="compman.gif" width="107" height="98" />
<form>
<input type="button" onclick="setWidth()" value="Change Width">
</form>
</body>
</html>
定位：
显示当前页的地址和改变当前页的地址
<html>
<head>
<script type="text/javascript">
function curr_Location()
{
alert(location)
}
function change_Location()
{
window.location="http://www.w3schools.com"
}
</script>
</head>
<body>
<form>
<input type="button" onclick="curr_Location()" value="Show current URL">
<input type="button" onclick="change_Location()" value="Change URL">
</form>
</body>
</html>
刷新页面
<html>
<head>
<script type="text/javascript">
function refresh()
{
window.location.reload()
}
</script>
</head>
<body>
<form>
<input type="button" value="Refresh page" onclick="refresh()">
</form>
</body>
</html>
导航对象
检测你的浏览器
<html>
<body>
<script type="text/javascript">
document.write("You are browsing this site with: "+ navigator.appName)
</script>
</body>
</html>
显示浏览器更加详细的信息
<html>
<body>
<script type="text/javascript">
document.write("<p>Browser: ")
document.write(navigator.appName + "</p>")
document.write("<p>Browserversion: ")
document.write(navigator.appVersion + "</p>")
document.write("<p>Code: ")
document.write(navigator.appCodeName + "</p>")
document.write("<p>Platform: ")
document.write(navigator.platform + "</p>")
document.write("<p>Cookies enabled: ")
document.write(navigator.cookieEnabled + "</p>")
document.write("<p>Browser's user agent header: ")
document.write(navigator.userAgent + "</p>")
</script>
</body>
</html>
最详细的浏览器的信息
<html>
<body>
<script type="text/javascript">
var x = navigator
document.write("CodeName=" + x.appCodeName)
document.write("<br />")
document.write("MinorVersion=" + x.appMinorVersion)
document.write("<br />")
document.write("Name=" + x.appName)
document.write("<br />")
document.write("Version=" + x.appVersion)
document.write("<br />")
document.write("CookieEnabled=" + x.cookieEnabled)
document.write("<br />")
document.write("CPUClass=" + x.cpuClass)
document.write("<br />")
document.write("OnLine=" + x.onLine)
document.write("<br />")
document.write("Platform=" + x.platform)
document.write("<br />")
document.write("UA=" + x.userAgent)
document.write("<br />")
document.write("BrowserLanguage=" + x.browserLanguage)
document.write("<br />")
document.write("SystemLanguage=" + x.systemLanguage)
document.write("<br />")
document.write("UserLanguage=" + x.userLanguage)
</script>
</body>
</html>
按浏览器不同实现导航
<html>
<head>
<script type="text/javascript">
function redirectme()
{
bname=navigator.appName
if (bname.indexOf("Netscape")!=-1)
{
window.location="tryjs_netscape.htm"
return
}
if (bname.indexOf("Microsoft")!=-1)
{
window.location="tryjs_microsoft.htm"
return
}
window.location="tryjs_other.htm"
}
</script>
</head>
<body onload="redirectme()">
</body>
</html>
检测浏览器的版本
<html>
<head>
<script type="text/javascript">
function browserversion()
{
txt="Your browser is unknown"
browser=navigator.appVersion
if (browser.indexOf("2.")>-1)
{
txt="Your browser is from the stone-age!"
}
if (browser.indexOf("3.")>-1)
{
txt="You should update your browser!"
}
if (browser.indexOf("4.")>-1)
{
txt="Your browser is good enough!"
}
document.getElementById("message").innerHTML=txt
}
</script>
</head>
<body onload="browserversion()">
<span id="message"></span>
</body>
</html>
选择对象
设置下拉列表的可用性
<html>
<head>
<script type="text/javascript">
function makeDisable()
{
var x=document.getElementById("mySelect")
x.disabled=true
}
function makeEnable()
{
var x=document.getElementById("mySelect")
x.disabled=false
}
</script>
</head>
<body>
<form>
<select id="mySelect">
<option>Apple</option>
<option>Banana</option>
<option>Orange</option>
</select>
<input type="button" onclick="makeDisable()" value="Disable list">
<input type="button" onclick="makeEnable()" value="Enable list">
</form>
</body>
</html>
返回下拉列表中选择的项的值
<html>
<head>
<script type="text/javascript">
function formAction()
{
var x=document.getElementById("mySelect")
alert(x.length)
}
</script>
</head>
<body>
<form>
<select id="mySelect">
<option>Apple</option>
<option>Banana</option>
<option>Orange</option>
</select>
<input type="button" onclick="formAction()" value="How many options in the list?">
</form>
</body>
</html>
改变下拉列表的大小
<html>
<head>
<script type="text/javascript">
function formAction()
{
var x=document.getElementById("mySelect")
x.size="3"
}
</script>
</head>
<body>
<form>
<select name="mySelect">
<option>Apple</option>
<option>Banana</option>
<option>Orange</option>
<option>Melon</option>
</select>
<input type="button" onclick="formAction()" value="Change size of list">
</form>
</body>
</html>
列表可选择多项
<html>
<head>
<script type="text/javascript">
function formAction()
{
var x=document.getElementById("mySelect")
x.multiple=true
}
</scr 上一页 [1] [2] [3] [4] [5] [6] [7] 下一页
[网页制作]Ultradev实例教程:5 做一个相对简单的网站后台(3) [网页制作]Ultradev实例教程:5 做一个相对简单的网站后台(2)
[网页制作]Ultradev实例教程:5 做一个相对简单的网站后台(1) [网页制作]Ultradev实例教程:4 插件的安装与使用
[网页制作]Ultradev实例教程:3.7 创建一个简单的查询 [网页制作]Ultradev实例教程:3.6 删除纪录
[网页制作]Ultradev实例教程:3.5 编辑数据库中的纪录 [网页制作]Ultradev实例教程:3.4 向数据库添加纪录
[网页制作]Ultradev实例教程:3.3 应用数据库创建动态网页 [网页制作]Ultradev实例教程:3.2 创建数据库连接
| 
注：本站部分文章源于互联网，版权归原作者所有！如有侵权，请原作者与本站联系，本站将立即删除！ 本站文章除特别注明外均可转载，但需注明出处！ [MinTao学以致用网] 
