4

Хочу отнять подстроку у ID. Вот этот код выводит NaN:

function someFunction(x) {
    var str = x.id;
    str = str - "Link";
    alert(str);
}
<li><a id="myLink" onclick="someFunction(this)">Должно остаться только my</a></li>

Что я делаю не так? Есть ли решения лучше?

4
  • 3
    как ты думаешь, что ты делаешь вот тут: +str ? и как ты вообще представляешь себе арифметику строк? 10 авг 2017 в 8:12
  • @IsinMin а откуда отчаяние? Документации, справки, туториалы и прочее по работе со строками в JS никто не закрывал.
    – Regent
    10 авг 2017 в 8:20
  • @IsinMin однако не запрещено создавать новую строку на базе существующей.
    – Regent
    10 авг 2017 в 8:23

2 ответа 2

7

Получить строку путём удаления из ID первого вхождения строки "Link" можно так:

function someFunction(x) {
    var str = x.id.replace("Link", "");
    console.log(str);
}
<li><a id="myLink" onclick="someFunction(this)">Должно остаться только my</a></li>

Тот же вариант с addEventListener вместо onclick:

document.addEventListener("DOMContentLoaded", function() {
    document.getElementById("myLink").addEventListener("click", function(event) {
        var str = event.target.id.replace("Link", "");
        console.log(str);
    });
});
<li><a id="myLink">Должно остаться только my</a></li>


Для удаления всех вхождений replace можно изменить:

replace(/Link/g, "")

Вообще говоря, в данной ситуации с единственным элементом с ID myLink с тем же успехом можно было просто сделать var str = "my";. Поэтому, для полноты картины, вариант с несколькими ссылками:

document.addEventListener("DOMContentLoaded", function() {
    var links = document.getElementsByClassName("links");
    for (var i = 0; i < links.length; i++) {
        links[i].addEventListener("click", function(event) {
            var str = event.target.id.replace("Link", "");
            console.log(str);
        });
    }
});
<ul>
    <li><a id="firstLink" class="links">Первая ссылка</a></li>
    <li><a id="secondLink" class="links">Вторая ссылка</a></li>
    <li><a id="thirdLink" class="links">Третья ссылка</a></li>
</ul>

И, наконец, то же самое при использовании jQuery:

$(function() {
    $(".links").on("click", function() {
        var str = this.id.replace("Link", "");
        console.log(str);
    });
});
<ul>
    <li><a id="firstLink" class="links">Первая ссылка</a></li>
    <li><a id="secondLink" class="links">Вторая ссылка</a></li>
    <li><a id="thirdLink" class="links">Третья ссылка</a></li>
</ul>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

2

Вот как вариант, но лучше так не делать вариант ниже с replace будет лучше

function someFunction(x) {
    var str = x.id;
    str = str.substr(0,2);
    alert(str);
}
<li><a id="myLink" onclick="someFunction(this)">Должно остаться только my</a></li>

Вариант по лучше. без учета регистра.

function someFunction(x) {
    var str = x.id;
    str = str.replace(/Link/i, '');
    alert(str);
}
<li><a id="myLInK" onclick="someFunction(this)">Должно остаться только my</a></li>

И наконец последний вариант с учетом регистра.

function someFunction(x) {
    var str = x.id;
    str = str.replace('Link', '');
    alert(str);
}
<li><a id="myLink" onclick="someFunction(this)">Должно остаться только my</a></li>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.