我有这个简单的阅读更多 JS 函数。我想重复使用它,最佳做法是什么?例如,下面有两个“阅读更多”按钮,但我必须将函数和一些数字复制粘贴到其中才能使用它。这不是最干净的方法,有什么更好的方法可以解决这个问题?
function myFunction() {
var dots = document.getElementById("dots");
var moreText = document.getElementById("more");
var btnText = document.getElementById("myBtn");
if (dots.style.display === "none") {
dots.style.display = "inline";
btnText.innerHTML = "Read more";
moreText.style.display = "none";
} else {
dots.style.display = "none";
btnText.innerHTML = "Read less";
moreText.style.display = "inline";
}
}
function myFunction2() {
var dots = document.getElementById("dots2");
var moreText = document.getElementById("more2");
var btnText = document.getElementById("myBtn2");
if (dots.style.display === "none") {
dots.style.display = "inline";
btnText.innerHTML = "Read more";
moreText.style.display = "none";
} else …Run Code Online (Sandbox Code Playgroud)是否可以使用某种形式的条件?
用代码构建新的设计风格。
通常<h1>标签下面有一条小线。标签<h2>也可以,但是当<h1>存在 时,<h2>标签下面不应该有一行。
h1:after {
display: block;
content: "";
background-color: green;
height: 3px;
border-radius: 6px;
width:50px
}
h2:after {
display: block;
content: "";
background-color: orange;
height: 3px;
border-radius: 6px;
width:30px
}Run Code Online (Sandbox Code Playgroud)
<h1>H1 title</h1>
<h2>So now this H2 title should not have a line since there is a h1 above it.</h2> Run Code Online (Sandbox Code Playgroud)