Question

如何在不添加id / classes的情况下使用JS更改第一个链接的文本/名称（所有项目）。

<ul>
<li class="current"><a data-filter="*" href="#">All Items</a></li>
<li class="cat-item cat-item-94"><a href="#" data-filter=".term-94" title="View all items filed under Oslavy"> Oslavy</a></li>
<li class="cat-item cat-item-93"><a href="#" data-filter=".term-93" title="View all items filed under Svadby">Svadby</a></li>
</ul>

谢谢

Answer 1

使用document.querySelector抓取元素，然后直接修改它的title属性：

＆＃13;

document.querySelector('[data-filter="*"]').title = "Banana";

＆＃13;

<ul>
<li class="current"><a data-filter="*" href="#">All Items</a></li>
<li class="cat-item cat-item-94"><a href="#" data-filter=".term-94" title="View all items filed under Oslavy"> Oslavy</a></li>
<li class="cat-item cat-item-93"><a href="#" data-filter=".term-93" title="View all items filed under Svadby">Svadby</a></li>
</ul>

＆＃13;

Answer 2

假设您想要更改的链接只将其父级“当前”作为类 ，并且链接是父级的第一个孩子，您可以尝试关注。

<Window.Resources>
    <LinearGradientBrush x:Key="gb" StartPoint="0 0" EndPoint="1 0">
        <LinearGradientBrush.GradientStops>
            <GradientStop Offset="0.0" Color="Red"/>
            <GradientStop Offset="0.1" Color="Black"/>
            <GradientStop Offset="0.9" Color="Black"/>
            <GradientStop Offset="1.0" Color="Red"/>
        </LinearGradientBrush.GradientStops>
    </LinearGradientBrush>
</Window.Resources>
<Grid>
    <Line X1="100" X2="200" Y1="100" Y2="100" Stroke="{StaticResource gb}" StrokeThickness="5"/>
</Grid>

window.onload = function()
{
document.getElementsByClassName('current')[0].childNodes[0].innerHTML="Hello";
 }

Answer 3

假设您使用的是jQuery，根据HTML的构建方式，有几种方法可以更新第一个列表项。

如果您确定当前类的项目始终是第一个：

$('ul li.current a').html('Banana');

如果您更愿意依赖列表项的外观顺序，请选择第一个：

$('ul li:first-child a').html('Apple');

注意：小心不要使用过于通用的选择器。您的整个页面可能会有不必要的更改。在您的情况下，最好有一个可清楚识别的父容器，并使用它来安全地定位您的列表。

用JS更改链接标题

3 个答案: