《原神》官网首页练习

最新推荐文章于 2024-09-16 07:26:12 发布

boboj1

最新推荐文章于 2024-09-16 07:26:12 发布

阅读量2.1k

点赞数 2

本文链接：https://blog.youkuaiyun.com/Wind_AN/article/details/118932309

版权

该博客主要展示了如何通过AJAX请求获取《原神》官网的数据，并利用JavaScript进行动态渲染。首先，详细介绍了完成的效果，接着讲解了项目数据的获取过程。文章重点在于AJAX的封装，提供了请求的主要代码。最后，博主分享了项目的整体布局和完整的案例代码，可在github上查看。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

完成效果

在这里插入图片描述

项目数据

在这里插入图片描述
通过ajax请求data中的数据然后通过js动态渲染到页面中
AJAX的封装

请求的主要代码

  function getInfo(index) {
   
    let message = null;
    switch (index) {
   
      case 0:
        $ajax({
   
          method: 'get',
          url: '../data/newest.json'

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

boboj1

关注关注

2
点赞
踩
8

收藏

觉得还不错? 一键收藏
2
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
打赏
打赏
打赏举报

举报

专栏目录

原神官网（采用HTML+CSS+JS+JDCB+Servlet+JSP+mysql）.zip

06-28

原生官网这个项目前端采用HTML+CSS+JS实现，后端采用JDCB+Servlet+JSP实现，数据库采用mysql，与北大青鸟易买网类似。附带项目答辩PPT

用CSS+JS+HTNL仿原神官网

weixin_51341142的博客

09-03

4236

CSS(Cascading Style Sheets，层叠样式表），是一种用来为结构化文档（如 HTML 文档或 XML 应用）添加样式（字体、间距和颜色等）的计算机语言，CSS文件扩展名为 .css。JavaScript（简称“JS”）是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名，但是它也被用到了很多非浏览器环境中，JavaScript 基于原型编程、多范式的动态脚本语言，并且支持面向对象。

2 条评论您还未登录，请先登录后发表或查看评论

原神私服搭建二：搭建服务端

最新发布

11-06

Python自制原神伤害计算涉及到使用Python编程语言开发的一个计算器，这个计算器能够模拟游戏《原神》中的角色伤害输出。原神是一款由中国公司miHoYo开发并运营的开放世界动作角色扮演游戏，游戏中玩家可以操控不同的...

这是大一的c语言程序设计作业，基于原神和碧蓝航线实现的抽卡模拟器.zip

01-11

在本项目中，我们主要探讨的是一个基于C语言编程实现的抽卡模拟器，这个模拟器是为大学一年级学生设计的课程作业，灵感来源于热门游戏《原神》和《碧蓝航线》中的抽卡机制。抽卡模拟器是游戏内常见的元素，它允许...

探索《原神》世界：Genshin Impact Monster Map 技术解析与应用指南

gitblog_00027的博客

04-24

530

探索《原神》世界：Genshin Impact Monster Map 技术解析与应用指南去发现同类优质开源项目:https://gitcode.com/ 如果你是《原神（Genshin Impact）》的玩家，你可能已经意识到在广袤的游戏世界中寻找特定的怪物并非易事。这就是进入舞台的地方。这个开源项目为游戏爱好者提供了一种直观且高效的方式来定位和追踪《原神》中的各种怪物。项目简介 Gen...

Genshin-AutoF:原神自动撷取

03-18

Genshin-AutoF 什么时候PC端才某些按键摘啊滚轮+ F太累了用前须知本脚本修改自b站火er丶： ://space.bilibili.com/12586633的脚本只是做了下决定点的修改，相比较原版速度变慢，但误触发了NPC几率升高（有时还是会触发） 1080P适用，若有问题需要自己修改确定点坐标，详细查看火er丶的视频： ://www.bilibili.com/video/BV1JA411s7Ud 功能自动拾取，自动点击传送点坐标使用方法：以.ahk打开 1，安装ahk 2，打开main1.ahk（需要管理员权限才能正常使用） 3，长按G 0.5s-1.2s开关，长按G 2s启动游戏（切换路径），一直声音提示以.exe打开 1，快捷程序以轴向员身份运行2，长按G 0.5s-1.2s开关，长按G 2s启动游戏（切换路径），一直声音提示若无法正常运行？ 1，是否

html+css的原神静态页面

10-03

此文件为html+css的简单原神静态页面适用于前端初学者，以及大学生。可以通过此代码了解定位流思想，其中涵盖了标准层，浮动层以及定位层的布局方式，有助于帮助初学者理清代码中的思想

原神官网具有前后端的毕设.zip

03-10

这个项目前端采用HTML+CSS+JS实现，后端采用JDCB+Servlet+JSP实现，后端实现了CRUD的操作，前端页面风格统一、美观，可以切换多种风格，现代风、古风等等，正在做毕业设计的小伙伴们或者有需要的小伙伴都可以下载使用。

UI-Router Extras 项目教程

gitblog_00328的博客

09-03

375

UI-Router Extras 项目教程 ui-router-extrasTHIS PROJECT IS NO LONGER MAINTAINED -- Extras for UI-Router for AngularJS. Sticky States (a.k.a. parallel states), Deep State Redirect (for tab-like navigation...

Genshin Impact 数据JSON处理指南

gitblog_00293的博客

09-16

510

Genshin Impact 数据JSON处理指南 genshin-data Genshin Impact JSON data. 项目地址: https://gitcode.com/gh_mirrors/ge/genshin-da...

4.2 Json文本存储

学编程的菜恐龙的博客

02-20

734

json.loads 和 json.load、json.dumps 和 json.dump

服务器搭建原神私服教程

用最简单的方式说最重要的事！服务器、存储、云计算、A智能的大数据产品、游戏开发技术。致力于广大开发者、政企用户、各项机构等，构建云上世界提供全方位云计算解决方案。旨在打造差异化的开放式闭环生态系统帮助用户快速构建稳定、安全的云计算环境。

02-04

1万+

项目的稳定版分支提供了编译好的服务端程序，但是博主觉得还是用dev版本的比较好。dev版本需要自己编译的，不要听到编译这两个字就头大，相反，这个服务端的编译相当简单。把文件中的两个IP地址127.0.0.1修改为你服务器的地址，修改完成后按 esc 输入 :wq。Mongodb作为服务端的数据库使用，我们这里安装最新版的Mongodb5。注意：如果想要使用最新版的服务端，必须安装＞＝17版本的java。tmux可以保证你关掉控制台的时候，程序依然继续运行。至此，服务端所需要的运行环境全部配置完成。

探秘《Teyvat TP Json》：旅行者的瓦利斯大陆工具箱

gitblog_00008的博客

03-28

302

探秘《Teyvat TP Json》：旅行者的瓦利斯大陆工具箱去发现同类优质开源项目:https://gitcode.com/ 如果你是《原神》（Genshin Impact）的玩家，那么你一定对游戏中各种角色的天赋、技能和属性有深入的研究兴趣。为了帮助玩家更便捷地理解和分析这些数据，开发者的项目。这是一个开源的数据解析库，为游戏内的角色信息提供结构化的JSON数据，让数据分析变得简单直观。技...

使用mock来mock数据

m0_53399981的博客

01-08

345

mock使用

easyx做原神点名程序

10-15

如果你想用它做一个原神角色点名程序，首先你需要熟悉EasyX的基本操作，比如窗口创建、控件添加、事件监听等。步骤大致如下： 1. **环境准备**：确保已经安装了EasyX库，并对C++有基本理解。 2. **创建窗口**：...