Question

尝试创建此文件，通过单击按钮更改对象的属性（大小，颜色，淡出和重置）。现在不工作，试图弄清楚我错过了什么......有什么想法吗？

Answer 1

我注意到的第一件事是<script>标记中的属性重复以及<script>和</script>之间的实际javascript。这是糟糕的编码。如果您需要在名为“javascript.js”的文件中引用的代码，那么它需要是HTML中自己的<script>声明：

<script type="text/javascript" src="javascript.js"></script>

这就是它。然后使用新的<script>声明块在页面上跟随您想要的任何代码。如果您正在尝试使jQuery库可用，可以使用以下方法完成:(将其放在html代码的<head></head>部分中。）

<script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script>

jQuery对你提供它的选择器非常讲究：

1）没有前缀符号表示html标记：$("table")表示匹配HTML中的任何<table>

2）点前缀符号表示匹配类：$(".button1")将查找您实际拥有的代码中的元素。找不到它们，因为您的选择器中没有带点的前缀。

3）hashtag / pound-sign / number-sign表示匹配ID：$("#box")会在代码的开头找到该框。

<script type="text/javascript">
$(function(){
    $(".button1").click(function(){
        $("#box").css({'height':400,'width':400});
    });
    $(".button2").click(function(){
        $("#box").css('background-color','blue');
    });
    $(".button3").click(function() {
       $("#box").fadeOut();
    });
    $(".button4").click(function() {
       $("#box").show().css({'height':150, 'width':150, 'background-color':'orange'});
    });
});
</script>

这是指向FUNCTIONING codepen的链接，显示您正在尝试做的事情。

在javascript中更改框属性onclick

1 个答案: