H5 知识点

最新推荐文章于 2022-06-05 10:02:22 发布

yunzhonghe5786

最新推荐文章于 2022-06-05 10:02:22 发布

阅读量275

点赞数

分类专栏： android布局文章标签： audio

本文链接：https://blog.csdn.net/yunzhonghe5786/article/details/54612570

版权

android布局专栏收录该内容

39 篇文章 0 订阅

订阅专栏

H5新特性video和audio标签

<!DOCTYPE html> 
<html> 
<body> 

<div style="text-align:center;">
  <button onclick="playPause()">播放/暂停</button> 
  <button onclick="makeBig()">大</button>
  <button onclick="makeNormal()">中</button>
  <button onclick="makeSmall()">小</button>
  <br /> 
  <video id="video1" width="420" style="margin-top:15px;">
    <source src="/example/html5/mov_bbb.mp4" type="video/mp4" />
    <source src="/example/html5/mov_bbb.ogg" type="video/ogg" />
    Your browser does not support HTML5 video.
  </video>
</div> 

<script type="text/javascript">
var myVideo=document.getElementById("video1");

function playPause()
{ 
if (myVideo.paused) 
  myVideo.play(); 
else 
  myVideo.pause(); 
} 

function makeBig()
{ 
myVideo.width=560; 
} 

function makeSmall()
{ 
myVideo.width=320; 
} 

function makeNormal()
{ 
myVideo.width=420; 
} 
</script> 

</body> 
</html>

在head中调用script

<html>
<head>
<script type="text/javascript">
function message()
{
  alert("该提示框是通过 onload 事件调用的。")
}
</script>
</head>

<body onload="message()">

</body>
</html>

在body中调用script

<html>
<head>
</head>

<body>

<script type="text/javascript">
document.write("该消息在页面加载时输出。")
</script>

</body>
</html>

调用外部脚本

<html>
<head>
</head>
<body>

<script src="/js/example_externaljs.js">
</script>

<p>
实际的脚本位于名为 "xxx.js" 的外部脚本中。
</p>

</body>

自定义事件

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}


function myFunction2()
{
  document.getElementById("head1").innerHTML="自定义函数";
}

</script>
</head>

<body>

<h1 id="head1">My Web Page</h1>

<p id="demo">A Paragraph.</p>

<button type="button" onclick="myFunction()">点击这里</button>

<button type="button" onclick="myFunction2()">点我</button>

</body>
</html>

yunzhonghe5786

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
H5 知识点

<!DOCTYPE html> <html> <body> <div style="text-align:center;"> <button onclick="playPause()">播放/暂停</button> <button onclick="makeBig()">大</button> <button onclick="makeNormal()">中</button> <
复制链接

扫一扫