码迷,mamicode.com
首页 > Web开发 > 详细

jQuery的prop和attr练习切换图片

时间:2020-03-05 13:30:01      阅读:101      评论:0      收藏:0      [点我收藏+]

标签:htm   charset   har   element   内容   tle   onclick   var   ext   

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>18-attr和prop的练习</title>
<script src="../js/jquery-1.12.4.js"></script>
<script>
$(function () {
//1.给我们的按钮天界点击事件
var btn=document.getElementsByTagName("button")[0];
btn.onclick=function () {
//2.获取输入框输入的内容
var input=document.getElementsByTagName("input")[0];
var text=input.value;
//3.修改img的src属性节点的值
// $("img").attr("src",text);
$("img").prop("src",text);

}


})
</script>
</head>
<body>
<input type="text">
<button>切换图片</button><br>
<img src="https://www.baidu.com/img/bd_logo1.png" >
</body>
</html>

jQuery的prop和attr练习切换图片

标签:htm   charset   har   element   内容   tle   onclick   var   ext   

原文地址:https://www.cnblogs.com/god1/p/12419387.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!