我试图通过使用JavaScript向HTML中的按钮添加操作 [英] I am trying to add actions to buttons in HTML by using javascript
问题描述
我对JavaScript有点新手，我只是通过按下按钮来尝试放大或制作Box，或者使用JavaScript将盒子的颜色更改为不同的颜色。例如，每次按下标记为grow的按钮时，都要展开框的图像。我想知道如何将按钮链接到盒子的图像。这也适用于盒子的颜色。请帮助，非常感谢。谢谢。
这是我的HTML代码我试图使用Javascript增强的网页：
< html>
< head>
< title> Jiggle Into JavaScript< / title>
<！ - < script type =text / javascriptsrc =https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js> < /脚本> - >
< / head>
< body>
< p>按按钮更改框！< / p>
< div id =boxstyle =height：150px; width：150px; background-color：orange; margin：25px>< / div>
< button id =button1> Grow< / button>
< button id =button2> Blue< / button>
< button id =button3> Fade< / button>
< button id =button4>重置< / button>
< script type =text / javascriptsrc =javascript.js>< / script>
< / body>
< / html>
我尝试过：
我尝试了很多东西，但我对JavaScript缺乏经验，这使得这项任务更具挑战性。请帮忙。谢谢
使用jQuery（一个JavaScript库）看看演示代码，在学习的同时获得一些乐趣：<！DOCTYPE html> ;
< html>
< head>
< script src =https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js>< / script>
< script>
（document）.ready（function（）{
（＃grow）。click（function） （）{
I am a little new to JavaScript, i'm having trouble trying to enlarge or make a Box grow just by pressing a button, or to change the color of the box into a different color using JavaScript. For example, to expand the image of the box each time the button labeled grow is pressed. I am wondering on how to link the buttons into the image of the box. that goes for the coloring of the box as well. Please help, much appreciated. Thank you.
Here are my HTML codes for my webpage that I am trying to enhance using Javascript:
<html>
<head>
<title>Jiggle Into JavaScript</title>
<!-- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> -->
</head>
<body>
<p>Press the buttons to change the box!</p>
<div id="box" style="height:150px; width:150px; background-color:orange; margin:25px"></div>
<button id="button1">Grow</button>
<button id="button2">Blue</button>
<button id="button3">Fade</button>
<button id="button4">Reset</button>
<script type="text/javascript" src="javascript.js"></script>
</body>
</html>
What I have tried:
I have tried a couple of things but I am very inexperienced in JavaScript which made this task more challenging. Please help. Thank You
Take a look at the demo code using jQuery-a JavaScript library, have some fun while learning:<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script>
(document).ready(function(){
("#grow").click(function(){
这篇关于我试图通过使用JavaScript向HTML中的按钮添加操作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
