javascript - 你会如何在最后隐藏这个按钮?
问题描述
我想在代码到达最后时隐藏按钮,但它不会隐藏。我想知道你们会怎么做?
这是html-
<body>
<main class="container">
<div class="countries">
</div>
<button class="btn-country">Where am I?</button>
<div class="images"></div>
</main>
</body>
这是脚本 -
const btn = document.querySelector('.btn-country');
const countriesContainer = document.querySelector('.countries');
const renderError = function (message) {
countriesContainer.insertAdjacentText('beforeend', message);
countriesContainer.style.opacity = 1;
};
const getCountrydata3 = function (country) {
fetch(`https://restcountries.eu/rest/v2/name/${country}`).then(res => res.json()).then(data => {
renderCountry(data[0]);
//set the neighbour country
const neighbour = data[0].borders[0];
//the guard clause
if (!neighbour) return;
//getting the data
return fetch(`https://restcountries.eu/rest/v2/alpha/${neighbour}`)
}).then(res => res.json()).then(data => renderCountry(data, 'neighbour')).catch(err => renderError(`Something went wrong! ${err.message}`)).finally(() => {
console.log('damn button won\'t hide');
btn.style.visibility = hidden; //<---**Here it is not working**
})
};
btn.addEventListener('click', function () {
getCountrydata3('sfsfsf');
})
这个按钮不会隐藏在finally中。:S
解决方案
试试这个方法
btn.style.visibility = "hidden";
或者,
document.querySelector('.btn-country').style.visibility = "hidden";
或者,
document.querySelector('.btn-country').style.display ="none";
如果它不起作用,请尝试使用 jquery 或任何其他易于使用的库
推荐阅读
- javascript - TypeScript:强制将变量识别为一种类型而不进行强制转换
- linux - Linux,将网页内容另存为文本
- android - 在启动画面中显示 Android 权限
- c++ - 命名参数习语和(抽象)基类
- firebase - 如何在不查询整个数据的情况下查询 Firestore 数据“按距离排序”
- python-3.x - Python SSLError - 隐藏警告的任何方式
- java - 如何在外部 java 类中添加动态按钮?
- nuget - Artifactory Nuget 恢复失败
- c - 数组中的拆分数字
- ios - 无法强制展开非可选类型“(UIImagePickerController,[UIImagePickerController.InfoKey:UIImage])->()的值