javascript - jQuery 通过属性定位元素并替换它的 HTML

Question

JS:

$('.translate').on('click', function(){

    $("*").each(function() {

        $.each(this.attributes, function() {            
            if (this.name.indexOf('uloc') == 0) {

                $(this).parent().html("HELLOOOOOOOO!");

                console.log(this.name + ' has the value: ' + this.value);
            }
        });
    });

});

HTML:

<ul>
    <li><a href="" uloc="report_problem">Report a problem</a></li>
    <li><a href="" uloc="privacy_policy">Privacy Policy</a></li>
    <li><a href="" uloc="terms_of_service">Terms of Service</a></li>
</ul>

<ul>
    <li><a class="translate" locale="fr">Français</a></li>
    <li><a class="translate" locale="en">English</a></li>
</ul>

因此，单击时，找到的元素中的文本应替换为 Hello。

我怎样才能做到这一点？

Answer 1

你可以一个简单的attribute selector首先:

$('.translate').on('click', function() {

  $("[uloc]").html("HELLOOOOOOOO!");

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
    <li><a href="" uloc="report_problem">Report a problem</a></li>
    <li><a href="" uloc="privacy_policy">Privacy Policy</a></li>
    <li><a href="" uloc="terms_of_service">Terms of Service</a></li>
</ul>

<ul>
    <li><a class="translate" locale="fr">Français</a></li>
    <li><a class="translate" locale="en">English</a></li>
</ul>