HTML代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>测试</title>
<script src="jquery-3.3.1.js"></script>
<script src="text2.js"></script>
<!--注意:引入自己的JS文件必须要在库文件下面引入,因为自己的JS文件要执行必须调用其库函数-->
</head>
<body>
<p><a href="http://www.baidu.com" id="a1">谷歌据说要回来</a></p>
<p><a href="http://www.baidu.com" class="a2">百度慌了</a></p>
<button>改变</button>
</body>
</html>
JS代码:
$(document).ready(function () {
$("button").click(function () {
$("a").attr('href',"http://www.bilibili.com");
$("#a1").text("B站");
$(".a2").text("你值得拥有");
})
//attr()方法后面修改属性,前面一个参数用单引号里面指定元素,逗号隔开,再用双引号指定更改的内容
//text()方法后面更改标签显示的内容
//上面通过标签名,id选择器,class选择器跟CSS一样
});
效果: