HTML和es6！！

想知道这种可以互动的页面怎么写，我真的很需要，用html和css和java（应该有这个）写出这个代码

学习项目的时候做过类似的，当时我使用的异步请求ajax，点击去结算发送异步请求到后台；勾选框是前端实现的，不太了解，购买商品数量我当时是通过vue框架中的双向绑定，如果不采用vue框架，js应该需要写一个单击响应函数

用html/css/javascript可以写出来，其主要交互在于，当勾选每一个项目的单选框时，去计算价格和修改css样式，主要给单选框添加onchange的相应事件，在响应事件中去写计算价格和修改样式的逻辑。

前端 用 html，js ,ajax 后端写接口 亲端可以 参考这个
https://blog.csdn.net/weixin_44058725/article/details/121223782

或者你百度 购物车 有很多类似的

不知道你这个问题是否已经解决, 如果还没有解决的话:

• 你可以参考下这个问题的回答, 看看是否对你有帮助, 链接: https://ask.csdn.net/questions/333522
• 除此之外, 这篇博客: Java爬虫之爬取多篇含有关键词的文章标题和内容中的 需要对html一些标签有一定的了解 部分也许能够解决你的问题, 你可以仔细阅读以下内容或者直接跳转源博客中阅读:
  

  可以到

  w3cschool了解html相关知识；
  打开维科闻网站输入关键词后，按F12开发者工具，或者右键点击查看源，就可以看到网页的源代码。
• 您还可以看一下 刘志远老师的JAVAEE真实课堂系列之HTML和CSS课程中的 1_Html介绍及排版标签小节, 巩固相关知识点
  
• 以下回答来自chatgpt:

  答案：

  如何编写可交互的HTML页面，使用ES6编写代码？

  为编写可交互的HTML页面，需要运用HTML、CSS和JavaScript。HTML页面几乎都是由表单、按钮等交互元素组成，为了使它们响应用户的操作，需要使用JavaScript来处理事件，例如点击、鼠标滑过等。同时，通过使用ES6语法可以在代码中使用更加简洁且易于理解的语法，下面是实现该任务的一些步骤：

  1.组织和优化代码

  为提高代码的可读性和维护性，需要进行代码组织和优化。可以按照不同的功能将代码拆分成模块，使用模块化的方式编写代码，并使用ES6的import和export来导入导出模块。

  使用注释来解释代码的作用，在模块上方使用JSdoc来描述模块的作用、输入和输出的数据类型等信息。

  2.添加事件处理程序

  需要添加事件处理程序来响应用户的操作，例如点击、鼠标滑过等事件。可以使用addEventListener()方法来为元素添加事件监听器，例如：

  const button = document.querySelector('#myButton'); button.addEventListener('click', () => { console.log('button clicked!'); });

  3.使用ES6语法

  使用ES6语法可以让代码更加简洁，易于理解。例如，可以使用箭头函数来替代传统的函数声明：

  const greet=()=>{console.log('hello');}greet();

  4.响应式设计

  为了使网页在各种屏幕设备上都能够完美地展示，需要对网页进行响应式设计。可以使用CSS media query来实现响应式布局，例如：

  @media screen and (min-width: 768px) { body { background-color: yellow; } }

  上面的代码表示在屏幕宽度大于等于768px时，将body的背景色设置为黄色。

  总的来说，编写可交互的HTML页面，使用ES6编写代码涉及多个方面，从组织代码、添加事件处理程序到采用响应式设计等等，需要在这些方面都下功夫来实现一个完美的页面。

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^