根据屏幕宽度更改JavaScript中的标记属性

我试图使用媒体查询更改a标记的属性，但我发现带有超链接的媒体纯粹是建议性的。因此，另一种选择是使用JavaScript，但我似乎很难让screen.width正常工作

JavaScript:

function adjustHeight(){
    var actual_width=screen.width;
    alert("width: " + actual_width);
    if(actual_width < 1281) {
        var h1= document.getElementById('procsLink').getAttribute('font-size');
        alert("font-size: " + h1);
        h1 = 35px;
        document.getElementById('procsLink').setAttribute('<font></font>-size',h1)
    }
return false;
}

下面是我的代码：

注意：我知道有一种方法可以使链接在“单击”后仍然显示，以便您可以看到更改的属性。不知道怎么做

我需要做什么才能让JavaScript识别屏幕大小？我的a标签正确吗

多谢各位

function adjustHeight(){

    var actual_width  =screen.width;
    alert("width: " + actual_width);
    if(actual_width < 1281) {
        var h1 = document.getElementById('procsLink').getAttribute('font-size');
        alert("font-size: " + h1);
        h1 = "35px";
        document.getElementById('procsLink').setAttribute('font-size',h1)
    }
    return false;
}

将报价添加到35px

---

将报价添加到35px

您在以下内容后错过了分号：

document.getElementById('procsLink').setAttribute('<font></font>-size',h1)

并将报价添加到35px

你的代码现在运行良好，我更新了你的

---

您在以下内容后错过了分号：

document.getElementById('procsLink').setAttribute('<font></font>-size',h1)

并将报价添加到35px

你的代码现在运行良好，我更新了你的

---

问题是，锚定标记上没有id，因此请按如下方式调整html： -将id添加到锚标记 -删除了实际链接，以便您可以看到标签更改字体大小 -删除了onclick中的分号

<span id="sigs" style="display: block;">
    <li >
        <a id="procsLink" href="#" onclick="adjustHeight()" class="sigsLink" >Manage Signatures</a>
    </li>
</span>

你的JS是这样的：

#procsLink{
    font-size: 14px;
}

function adjustHeight(){

    var actual_width = window.innerWidth;

    if(actual_width < 1281) {
        var h1 = document.getElementById('procsLink');
        var newFontSize = '35px';
        h1.style.fontSize = newFontSize;
    }

}

---

问题是，锚定标记上没有id，因此请按如下方式调整html： -将id添加到锚标记 -删除了实际链接，以便您可以看到标签更改字体大小 -删除了onclick中的分号

<span id="sigs" style="display: block;">
    <li >
        <a id="procsLink" href="#" onclick="adjustHeight()" class="sigsLink" >Manage Signatures</a>
    </li>
</span>

你的JS是这样的：

#procsLink{
    font-size: 14px;
}

function adjustHeight(){

    var actual_width = window.innerWidth;

    if(actual_width < 1281) {
        var h1 = document.getElementById('procsLink');
        var newFontSize = '35px';
        h1.style.fontSize = newFontSize;
    }

}

---

“字体大小”不是标签的属性，而是CSS样式。专业提示：不要使用警报，请使用console.log。它使调试变得更容易。您可能还希望读取“字体大小”不是标记的属性，而是CSS样式。Pro提示：不要使用警报，请使用console.log。它使调试变得更容易。您可能还想阅读“没问题，乐于助人：没问题，乐于助人”：