仿去哪网世界各地城市选择使用JavaScript，Jquery，vue实现前端静态网页
如图下：
废话不多说上代码：
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="jq/jquery-3.6.0.js" type="text/javascript" charset="utf-8"></script>
<script src="vue.min.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="css/new_file.css" />
</head>
<body>
<div id="app">
<!-- 城市选择 -->
<div class="kity">
<!-- 城市选择一行 -->
<div class="kity_one clearfix">
<div class="kity_one_lf">
<svg t="1630156425550" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg" p-id="2147" width="50" height="50">
<path
d="M721.768049 957.138196c-7.789407 0-15.579837-2.935865-21.571295-8.867972l-419.492096-414.459476c-5.812379-5.752004-9.106402-13.601786-9.106402-21.810748 0-8.207939 3.295046-16.057721 9.106402-21.809725l419.492096-414.459476c11.983939-11.983939 31.457456-11.744485 43.382043 0.239454 11.864212 12.103666 11.744485 31.517831-0.239454 43.382043L345.955778 512l397.382543 392.648728c11.983939 11.864212 12.103666 31.277354 0.239454 43.382043C737.586316 954.082604 729.678206 957.138196 721.768049 957.138196z"
p-id="2148" fill="#ffffff"></path>
</svg>
</div>
<div class="kity_one_kity">城市选择</div>
</div>
<!-- 城市下面两个div -->
<div class="kity_tow clearfix">
<!-- 第一个div -->
<div class="kity_lf btn">境内</div>
<div class="kity_rt btn">境外 港澳台</div>
</div>
</div>
<div class="transition" id="transition">
<!-- 热门城市 -->
<div id="Hot_city">
<h2 class="Hot_city_font">热门城市</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- 字母排序 -->
<div id="order">
<h2 class="Hot_city_font">字母排序</h2>
<!-- 内容 -->
<div class="Hot_city_hot">
<ul class="order_neirong_q clearfix">
<li class="ordernei_neirong" v-for="(item,index) of z">{{item}}</li>
</ul>
</div>
</div>
<!-- A -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of a">{{item}}</li>
</div>
</div>
<!-- B -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of B">{{item}}</li>
</ul>
</div>
</div>
<!-- C -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- D -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of D">{{item}}</li>
</ul>
</div>
</div>
<!-- E -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of E">{{item}}</li>
</ul>
</div>
</div>
<!-- F -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of F">{{item}}</li>
</ul>
</div>
</div>
<!-- G -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of G">{{item}}</li>
</ul>
</div>
</div>
<!-- H -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of H">{{item}}</li>
</ul>
</div>
</div>
<!-- J -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of J">{{item}}</li>
</ul>
</div>
</div>
<!-- K -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of K">{{item}}</li>
</ul>
</div>
</div>
<!-- L -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of L">{{item}}</li>
</ul>
</div>
</div>
<!-- M -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of M">{{item}}</li>
</ul>
</div>
</div>
<!-- N -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of N">{{item}}</li>
</ul>
</div>
</div>
<!-- P -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of P">{{item}}</li>
</ul>
</div>
</div>
<!-- Q -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of Q">{{item}}</li>
</ul>
</div>
</div>
<!-- R -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of R">{{item}}</li>
</ul>
</div>
</div>
<!-- S -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of S">{{item}}</li>
</ul>
</div>
</div>
<!-- T -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of T">{{item}}</li>
</ul>
</div>
</div>
<!-- W -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of W">{{item}}</li>
</ul>
</div>
</div>
<!-- X -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of X">{{item}}</li>
</ul>
</div>
</div>
<!-- Y -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of Y">{{item}}</li>
</ul>
</div>
</div>
<!-- Z -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of Z">{{item}}</li>
</ul>
</div>
</div>
</div>
<!-- 第二个数组 -->
<div class="transition">
<!-- 热门城市 -->
<div id="Hot_city">
<h2 class="Hot_city_font">woscaschinid</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- 字母排序 -->
<div id="order">
<h2 class="Hot_city_font">字母排序</h2>
<!-- 内容 -->
<div class="Hot_city_hot">
<ul class="order_neirong_q clearfix">
<li class="ordernei_neirong" v-for="(item,index) of z">{{item}}</li>
</ul>
</div>
</div>
<!-- A -->
<div id="Hot_city">
<h2 class="Hot_city_font">A</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</div>
</div>
<!-- B -->
<div id="Hot_city">
<h2 class="Hot_city_font">B</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- C -->
<div id="Hot_city">
<h2 class="Hot_city_font">C</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- D -->
<div id="Hot_city">
<h2 class="Hot_city_font">D</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- E -->
<div id="Hot_city">
<h2 class="Hot_city_font"></h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- F -->
<div id="Hot_city">
<h2 class="Hot_city_font">F</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- G -->
<div id="Hot_city">
<h2 class="Hot_city_font">G</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- H -->
<div id="Hot_city">
<h2 class="Hot_city_font">H</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- J -->
<div id="Hot_city">
<h2 class="Hot_city_font">J</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- K -->
<div id="Hot_city">
<h2 class="Hot_city_font">K</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- L -->
<div id="Hot_city">
<h2 class="Hot_city_font">L</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- M -->
<div id="Hot_city">
<h2 class="Hot_city_font">M</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- N -->
<div id="Hot_city">
<h2 class="Hot_city_font">N</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- P -->
<div id="Hot_city">
<h2 class="Hot_city_font">P</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- Q -->
<div id="Hot_city">
<h2 class="Hot_city_font">Q</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- R -->
<div id="Hot_city">
<h2 class="Hot_city_font">R</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- S -->
<div id="Hot_city">
<h2 class="Hot_city_font">S</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- T -->
<div id="Hot_city">
<h2 class="Hot_city_font">T</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- W -->
<div id="Hot_city">
<h2 class="Hot_city_font">W</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- X -->
<div id="Hot_city">
<h2 class="Hot_city_font">X</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- Y -->
<div id="Hot_city">
<h2 class="Hot_city_font">Y</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
<!-- Z -->
<div id="Hot_city">
<h2 class="Hot_city_font">Z</h2>
<div class="Hot_city_hot">
<ul class="Hot_city_hot_neirong_q clearfix">
<li class="Hot_city_hot_neirong" v-for="(item,index) of v">{{item}}</li>
</ul>
</div>
</div>
</div>
</div>
<script type="text/javascript">
var app = new Vue({
el: '#app',
data: {
v: [
'北京',
'上海',
'三亚',
'丽江',
'杭州',
'广州',
'成都',
'深圳',
'苏州',
'桂林',
'西安',
'厦门'
],
z: [
'',
'',
'',
'',
' ',
'',
'',
'',
'',
'',
'',
'',
'',
'',
'',
'',
'',
'',
'',
'',
'',
''
],
a: [
'阿坝藏族羌族自治州',
'阿克苏地区',
'阿拉尔',
'阿拉善盟',
'阿勒泰',
'阿里',
'安康',
'安庆',
'安顺',
'安阳',
'鞍山',
'澳门'
],
B: [
'巴彦淖尔',
'巴音郭楞',
'巴中',
'白城',
'白沙',
'白山',
'白银',
'百色',
'蚌埠',
'包头',
'宝鸡',
'保定',
'保山',
'保亭',
'北海',
'北京',
'本溪',
'毕节',
'滨州',
'亳州',
'博尔塔拉'
],
C: [
"沧州",
"昌都",
"昌吉",
"常德",
"常州",
"巢湖",
"朝阳",
"潮州",
"郴州",
"成都",
"承德",
"澄迈",
"池州",
"赤峰",
"崇左",
"滁州",
"楚雄",
"长春",
"长葛市",
"长沙",
"长治",
"重庆"
],
D: [
"达州",
"大理",
"大连",
"大庆",
"大同",
"大兴安岭",
"丹东",
"儋州",
"淡水",
"德宏",
"德阳",
"德州市",
"迪庆",
"定安",
"定西",
"东方",
"东莞",
"东营",
"敦煌市"
],
E: [
"鄂尔多斯",
"鄂州",
"恩施"
],
F: [
"防城港",
"佛山",
"福州",
"抚顺",
"抚州",
"阜新",
"阜阳"
],
G: [
"甘南",
"甘孜州",
"赣州",
"高雄",
"固原",
"广安",
"广元",
"广州",
"贵港",
"贵阳",
"桂林",
"果洛藏族自治州"
],
H: [
"哈尔滨",
"哈密",
"海北藏族自治州",
"海东地区",
"海口",
"海南藏族自治州",
"海西蒙古族藏族自治州",
"邯郸",
"汉中",
"杭州",
"合肥",
"和田",
"河池",
"河源",
"菏泽",
"贺州",
"鹤壁",
"鹤岗",
"黑河",
"衡水",
"衡阳",
"红河",
"呼和浩特",
"呼伦贝尔",
"葫芦岛",
"湖州",
"花莲",
"怀化",
"淮安",
"淮北",
"淮南",
"黄冈",
"黄南藏族自治州",
"黄山市",
"黄石",
"惠州"
],
J: [
"鸡西",
"基隆",
"吉安",
"吉林市",
"济南",
"济宁",
"济源",
"佳木斯",
"嘉兴",
"嘉义",
"嘉峪关",
"江门",
"焦作",
"揭阳",
"金昌",
"金华",
"锦州",
"晋城",
"晋中",
"荆门",
"荆州",
"景德镇",
"九江",
"酒泉"
],
K: [
"喀什",
"开封",
"克拉玛依",
"克孜勒苏",
"克孜勒苏柯尔克孜",
"昆明",
],
L: [
"拉萨",
"来宾",
"莱芜",
"莱州市",
"兰州",
"廊坊",
"乐东",
"乐山",
"丽江",
"丽水",
"连云港",
"凉山州",
"辽阳",
"辽源",
"聊城",
"林芝",
"临沧",
"临汾",
"临高",
"临夏",
"临沂",
"陵水",
"柳州",
"六安",
"六盘水",
"龙岩",
"陇南",
"娄底",
"泸州",
"洛阳",
"漯河",
"吕梁"
],
M: [
"马鞍山",
"茂名",
"眉山",
"梅州",
"绵阳",
"苗栗",
"牡丹江"
],
N: [
"那曲",
"南昌",
"南充",
"南京",
"南宁",
"南平",
"南通",
"南投",
"南阳",
"内江",
"宁波",
"宁德",
"怒江"
],
P: [
"攀枝花",
"盘锦",
"平顶山",
"平湖",
"平凉",
"屏东",
"萍乡",
"莆田",
"濮阳",
"普宁"
],
Q: [
"七台河",
"齐齐哈尔",
"潜江",
"黔东南",
"黔南",
"黔西南",
"钦州",
"秦皇岛",
"青岛",
"清远",
"庆阳",
"琼海",
"琼中",
"衢州",
"曲靖",
"泉州"
],
R: [
"日喀则",
"日照",
"瑞金市",
],
S: [
"普洱",
"三门峡",
"三明",
"三沙",
"三亚",
"山南",
"汕头",
"汕尾",
"商洛",
"商丘",
"上海",
"上饶",
"韶关",
"邵阳",
"绍兴",
"深圳",
"神农架",
"沈阳",
"十堰",
"石河子",
"石家庄",
"石嘴山",
"双鸭山",
"朔州",
"四平",
"松原",
"苏州",
"绥化",
"随州",
"遂宁",
"宿迁",
"宿州"
],
T: [
"塔城地区",
"台北",
"台东",
"台南",
"台山市",
"台中",
"台州",
"太原",
"泰安",
"泰州",
"唐山",
"桃园",
"天津",
"天门",
"天水",
"铁岭",
"通化",
"通辽",
"铜川",
"铜陵",
"铜仁",
"图木舒克",
"吐鲁番",
"屯昌"
],
W: [
"万宁",
"威海",
"潍坊",
"渭南",
"温州",
"文昌",
"文山",
"乌海",
"乌兰察布",
"乌鲁木齐",
"无锡",
"芜湖",
"吴忠",
"梧州",
"五家渠市",
"五指山",
"武汉",
"武威"
],
X: [
"厦门",
"西安",
"西南中沙群岛办事处",
"西宁",
"西双版纳",
"锡林郭勒盟",
"仙桃",
"咸宁",
"咸阳",
"香港",
"湘潭",
"湘西",
"襄樊",
"襄阳",
"孝感",
"忻州",
"新北",
"新乡",
"新余",
"新竹",
"信阳",
"邢台",
"兴安盟",
"徐州",
"许昌",
"宣城",
],
Y: [
"雅安",
"烟台",
"延安",
"延边",
"盐城",
"扬州",
"阳江",
"阳泉",
"伊春",
"伊犁",
"伊犁哈萨克自治州",
"宜宾",
"宜昌",
"宜春",
"宜兰",
"益阳",
"银川",
"鹰潭",
"营口",
"永州",
"榆林",
"玉林",
"玉树藏族自治州",
"玉溪",
"岳阳",
"云浮",
"云林",
"运城"
],
Z: [
"枣庄",
"湛江",
"张家界",
"张家口",
"张掖",
"彰化",
"漳州",
"昭通",
"肇庆",
"镇江",
"郑州",
"中山",
"中卫",
"舟山",
"周口",
"珠海",
"株洲",
"驻马店",
"资阳",
"淄博",
"自贡",
"遵义"
]
}
})
</script>
</body>
</html>
<script type="text/javascript">
window.onload = function() {
//锚点设置
var Hot_city_font = document.querySelectorAll(".Hot_city_font");
// console.log(Hot_city_font);
//字母点击
var ordernei_neirong = document.querySelectorAll(".ordernei_neirong");
// --------------E点击的锚点-------------
var Hot_city_font_a1 = document.createElement("a");
Hot_city_font_a1.innerHTML = "A";
Hot_city_font_a1.name = "two";
Hot_city_font[2].appendChild(Hot_city_font_a1);
var ordernei_a1 = document.createElement("a");
ordernei_a1.href = "#two";
ordernei_a1.innerHTML = "A";
ordernei_neirong[0].appendChild(ordernei_a1);
// ------------B点击锚点--------------------
var Hot_city_font_a2 = document.createElement("a");
Hot_city_font_a2.innerHTML = "B";
Hot_city_font_a2.name = "tree";
Hot_city_font[3].appendChild(Hot_city_font_a2);
var ordernei_a2 = document.createElement("a");
ordernei_a2.href = "#tree";
ordernei_a2.innerHTML = "B";
ordernei_neirong[1].appendChild(ordernei_a2);
// ------------c点击锚点--------------------
var Hot_city_font_aC = document.createElement("a");
Hot_city_font_aC.innerHTML = "C";
Hot_city_font_aC.name = "C";
Hot_city_font[4].appendChild(Hot_city_font_aC);
var ordernei_aC = document.createElement("a");
ordernei_aC.href = "#C";
ordernei_aC.innerHTML = "C";
ordernei_neirong[2].appendChild(ordernei_aC);
// -----------D点击锚点--------------------
var Hot_city_font_aD = document.createElement("a");
Hot_city_font_aD.innerHTML = "D";
Hot_city_font_aD.name = "D";
Hot_city_font[5].appendChild(Hot_city_font_aD);
var ordernei_aD = document.createElement("a");
ordernei_aD.href = "#D";
ordernei_aD.innerHTML = "D";
ordernei_neirong[3].appendChild(ordernei_aD);
// -----------E点击锚点--------------------
var Hot_city_font_a = document.createElement("a");
Hot_city_font_a.innerHTML = "E";
Hot_city_font_a.name = "one";
Hot_city_font[6].appendChild(Hot_city_font_a);
var ordernei_a = document.createElement("a");
ordernei_a.href = "#one";
ordernei_a.innerHTML = "E";
ordernei_neirong[4].appendChild(ordernei_a);
// -----------F点击锚点--------------------
var Hot_city_font_aF = document.createElement("a");
Hot_city_font_aF.innerHTML = "F";
Hot_city_font_aF.name = "F";
Hot_city_font[7].appendChild(Hot_city_font_aF);
var ordernei_aF = document.createElement("a");
ordernei_aF.href = "#F";
ordernei_aF.innerHTML = "F";
ordernei_neirong[5].appendChild(ordernei_aF);
// -----------G点击锚点--------------------
var Hot_city_font_aG = document.createElement("a");
Hot_city_font_aG.innerHTML = "G";
Hot_city_font_aG.name = "G";
Hot_city_font[8].appendChild(Hot_city_font_aG);
var ordernei_aG = document.createElement("a");
ordernei_aG.href = "#G";
ordernei_aG.innerHTML = "G";
ordernei_neirong[6].appendChild(ordernei_aG);
// -----------H点击锚点--------------------
var Hot_city_font_aH = document.createElement("a");
Hot_city_font_aH.innerHTML = "H";
Hot_city_font_aH.name = "H";
Hot_city_font[9].appendChild(Hot_city_font_aH);
var ordernei_aH = document.createElement("a");
ordernei_aH.href = "#H";
ordernei_aH.innerHTML = "H";
ordernei_neirong[7].appendChild(ordernei_aH);
// -----------J点击锚点--------------------
var Hot_city_font_aJ = document.createElement("a");
Hot_city_font_aJ.innerHTML = "J";
Hot_city_font_aJ.name = "J";
Hot_city_font[10].appendChild(Hot_city_font_aJ);
var ordernei_aJ = document.createElement("a");
ordernei_aJ.href = "#J";
ordernei_aJ.innerHTML = "J";
ordernei_neirong[8].appendChild(ordernei_aJ);
// -----------K点击锚点--------------------
var Hot_city_font_aK = document.createElement("a");
Hot_city_font_aK.innerHTML = "K";
Hot_city_font_aK.name = "K";
Hot_city_font[11].appendChild(Hot_city_font_aK);
var ordernei_aK = document.createElement("a");
ordernei_aK.href = "#K";
ordernei_aK.innerHTML = "K";
ordernei_neirong[9].appendChild(ordernei_aK);
// -----------L点击锚点--------------------
var Hot_city_font_aL = document.createElement("a");
Hot_city_font_aL.innerHTML = "L";
Hot_city_font_aL.name = "L";
Hot_city_font[12].appendChild(Hot_city_font_aL);
var ordernei_aL = document.createElement("a");
ordernei_aL.href = "#L";
ordernei_aL.innerHTML = "L";
ordernei_neirong[10].appendChild(ordernei_aL);
// -----------M点击锚点--------------------
var Hot_city_font_aM = document.createElement("a");
Hot_city_font_aM.innerHTML = "M";
Hot_city_font_aM.name = "M";
Hot_city_font[13].appendChild(Hot_city_font_aM);
var ordernei_aM = document.createElement("a");
ordernei_aM.href = "#M";
ordernei_aM.innerHTML = "M";
ordernei_neirong[11].appendChild(ordernei_aM);
// -----------N点击锚点--------------------
var Hot_city_font_aN = document.createElement("a");
Hot_city_font_aN.innerHTML = "N";
Hot_city_font_aN.name = "N";
Hot_city_font[14].appendChild(Hot_city_font_aN);
var ordernei_aN = document.createElement("a");
ordernei_aN.href = "#N";
ordernei_aN.innerHTML = "N";
ordernei_neirong[12].appendChild(ordernei_aN);
// -----------P点击锚点--------------------
var Hot_city_font_aP = document.createElement("a");
Hot_city_font_aP.innerHTML = "P";
Hot_city_font_aP.name = "P";
Hot_city_font[15].appendChild(Hot_city_font_aP);
var ordernei_aP = document.createElement("a");
ordernei_aP.href = "#P";
ordernei_aP.innerHTML = "P";
ordernei_neirong[13].appendChild(ordernei_aP);
// -----------Q点击锚点--------------------
var Hot_city_font_aQ = document.createElement("a");
Hot_city_font_aQ.innerHTML = "Q";
Hot_city_font_aQ.name = "Q";
Hot_city_font[16].appendChild(Hot_city_font_aQ);
var ordernei_aQ = document.createElement("a");
ordernei_aQ.href = "#Q";
ordernei_aQ.innerHTML = "Q";
ordernei_neirong[14].appendChild(ordernei_aQ);
// -----------R点击锚点--------------------
var Hot_city_font_aR = document.createElement("a");
Hot_city_font_aR.innerHTML = "R";
Hot_city_font_aR.name = "R";
Hot_city_font[17].appendChild(Hot_city_font_aR);
var ordernei_aR = document.createElement("a");
ordernei_aR.href = "#R";
ordernei_aR.innerHTML = "R";
ordernei_neirong[15].appendChild(ordernei_aR);
// -----------S点击锚点--------------------
var Hot_city_font_aS = document.createElement("a");
Hot_city_font_aS.innerHTML = "S";
Hot_city_font_aS.name = "S";
Hot_city_font[18].appendChild(Hot_city_font_aS);
var ordernei_aS = document.createElement("a");
ordernei_aS.href = "#S";
ordernei_aS.innerHTML = "S";
ordernei_neirong[16].appendChild(ordernei_aS);
// -----------T点击锚点--------------------
var Hot_city_font_aT = document.createElement("a");
Hot_city_font_aT.innerHTML = "T";
Hot_city_font_aT.name = "T";
Hot_city_font[19].appendChild(Hot_city_font_aT);
var ordernei_aT = document.createElement("a");
ordernei_aT.href = "#T";
ordernei_aT.innerHTML = "T";
ordernei_neirong[17].appendChild(ordernei_aT);
// -----------W点击锚点--------------------
var Hot_city_font_aW = document.createElement("a");
Hot_city_font_aW.innerHTML = "W";
Hot_city_font_aW.name = "W";
Hot_city_font[20].appendChild(Hot_city_font_aW);
var ordernei_aW = document.createElement("a");
ordernei_aW.href = "#W";
ordernei_aW.innerHTML = "W";
ordernei_neirong[18].appendChild(ordernei_aW);
// -----------X点击锚点--------------------
var Hot_city_font_aX = document.createElement("a");
Hot_city_font_aX.innerHTML = "X";
Hot_city_font_aX.name = "X";
Hot_city_font[21].appendChild(Hot_city_font_aX);
var ordernei_aX = document.createElement("a");
ordernei_aX.href = "#X";
ordernei_aX.innerHTML = "X";
ordernei_neirong[19].appendChild(ordernei_aX);
// -----------Y点击锚点--------------------
var Hot_city_font_aY = document.createElement("a");
Hot_city_font_aY.innerHTML = "Y";
Hot_city_font_aY.name = "Y";
Hot_city_font[22].appendChild(Hot_city_font_aY);
var ordernei_aY = document.createElement("a");
ordernei_aY.href = "#Y";
ordernei_aY.innerHTML = "Y";
ordernei_neirong[20].appendChild(ordernei_aY);
// -----------Z点击锚点--------------------
var Hot_city_font_aZ = document.createElement("a");
Hot_city_font_aZ.innerHTML = "Z";
Hot_city_font_aZ.name = "Z";
Hot_city_font[23].appendChild(Hot_city_font_aZ);
var ordernei_aZ = document.createElement("a");
ordernei_aZ.href = "#Z";
ordernei_aZ.innerHTML = "Z";
ordernei_neirong[21].appendChild(ordernei_aZ);
}
</script>
<script type="text/javascript">
$(".btn").click(function() {
$(".transition").attr("id", "");
$(".transition").eq($(this).index()).attr("id", "transition");
$(this).css({
"background": "#fff",
"color": "#00bcd4"
}).siblings().css({
"background": "none",
"color": "#ffffff"
})
})
</script>
475
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
