js函数script放在head和body里的差别、innerHtml和innerText差别等介绍
1.script放在head和body里的差别
2.innerhtml和innertext差别
innerhtml获取整个对象
innertext获取的是文本值
实例:
3. 事件源 当前获取的按钮
事件名称
body>
<input type="button" name="btn" id="btn" value="点我" />
</body>
<script type="text/javascript">
var btn=document.getelementbyid("btn");//通过id获取元素
btn.onclick=function(){
prompt("我速度是");
}
</script>
4.innerhtml用法事例
5.函数返回false的主要作用
终止某一段程序
<a id="aaa" href="www.baidu.com">第一次遇见你,你就像一个啥子一样</a>
var ajs=document.getelementbyid("aaa");
ajs.onclick=fbunction(){
prompt("你是一个*啊,我受不撩了啊")
}
return false;
*****************************************************************
length长度 字符串类型的集合
set大小 数字类型集合 .get(i)方式
*****************************************************************
6.通过标签,id,name获取元素
标签:getelementsbytagname
id:getelementbyid
name:getelementsbyname
实例:
<input type="button" name="btn" id="btn" value="点我" />
<a >第一次遇见你,你就像一个啥子一样</a>
<a >第一次遇见你,你就像一个啥子一样</a>
<a >第一次遇见你,你就像一个啥子一样</a>
<a >第一次遇见你,你就像一个啥子一样</a>
<a >第一次遇见你,你就像一个啥子一样</a>
<script type="text/javascript">
btn.onclick=function() {
var a1=document.getelementsbytagname("a");//返回的是一个集合 一定不能忘了是tagname 获取标签
for (var i = 0; i < a1.length; i++) {
alert(a1[i]);
}
}
</script>
7.操作修改获得元素的属性
例:改变一个a标签内的内容
<a id="btn">dsgfdjshufdsufjdshfgd</a>
<script type="text/javascript">
var btn=document.getelementbyid("btn");
btn.onclick=function(){
btn.innertext="我爱你,亲爱的姑娘";
}
</script>
例:图片切换效果
<body>
<img src="image/a1 (1).jpg" id="imgss"/>
<script type="text/javascript">
var a=1;
var b=document.getelementbyid("imgss");
b.onclick=function(){
if (a==4) {
a=1;
}
if (a==1) {
b.src="image/a1 (2).jpg";
} else if(a==2){
b.src="image/a1 (3).jpg";
}else if(a==3){
b.src="image/a1 (1).jpg";
}
a++;
}
</script>
</body>
例:图片查看效果
<body>
<img src="images/a1 (1).jpg" id="img1" width="185" height="260" />
<img src="images/a1 (2).jpg" id="img2" width="185" height="260" />
<img src="images/a1 (3).jpg" id="img3" width="185" height="260" />
<img src="images/a1 (4).jpg" id="img4" width="185" height="260" />
<br />