Как получить html-данные из & ldquo; this & rdquo; объект - Ванильный JavaScript [дубликаты]

Question

Как получить html-данные из & ldquo; this & rdquo; объект - Ванильный JavaScript [дубликаты]

Hashing.sha1().hashString( "password", Charsets.UTF_8 ).toString()

1

javascript html dom

задан Felix Kling 18 March 2019 в 18:23

2 ответа

Другие вопросы по тегам:

javascript html dom

Похожие вопросы:

score 0 · Answer 1

Вот несколько изменений, которые вы можете сделать

Вместо того, чтобы делать

document.querySelector("#selectionButton span:first-child").textContent, вы можете сделать

let getButtonSpan = document.getElementById('selectionButton').firstElementChild;

, это даст первый потомок внутри этого элемента dom с идентификатором selectionButton

Вы можете использовать forEach, хотя обычный цикл for одинаково хорош. Используйте аргумент forEach, чтобы получить якорный тег dom & amp; добавить слушатель события к нему. Нажмите на него, чтобы получить текст, используя innerHTML & amp; установите его для первого потомка кнопки.

Кроме getAttribute, вы также можете использовать набор данных для извлечения свойства data из домена.

В вашем коде, который заменяет jquery, вы используете $(this).data("parentid"), который нарушает вашу цель

let getButtonSpan = document.getElementById('selectionButton').firstElementChild;
document.getElementById('selectionList').querySelectorAll('a').forEach(function(item) {
  item.addEventListener('click', function() {
    getButtonSpan.innerHTML = item.innerHTML;
    let selectedParentID = item.dataset.parentid;
    let selectedType = item.dataset.type;
    if (selectedParentID && selectedType) {
      doSomeThing(selectedParentID, selectedType);
    }
  })

})

function doSomeThing(a, b) {
  console.log(`selectedParentID : ${a} & selectedType :${b}`)
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="selectionContainer" class="form-group">
  <button id="selectionButton" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
       <span>Select Grouping</span>&nbsp;
       <span class="caret"></span>
  
  </button>
  <ul id="selectionList" class="dropdown-menu" role="menu">
    <li><a href="javascript:;" data-parentid="11" data-type="1">Option 1</a></li>
    <li><a href="javascript:;" data-parentid="11" data-type="2">Option 2</a></li>
    <li><a href="javascript:;" data-parentid="11" data-type="3">Option 3</a></li>
    <li class="divider"></li>
    <li><a href="javascript:;" data-parentid="12" data-type="1">Alternate 1</a></li>
    <li><a href="javascript:;" data-parentid="12" data-type="2">Alternate 2</a></li>
    <li><a href="javascript:;" data-parentid="12" data-type="3">Alternate 3</a></li>
  </ul>
</div>

score 0 · Answer 2

Если у вас есть элемент с data-foo="bar", вы можете получить этот атрибут через

foo.getAttribute("data-foo")

Функция data() является jQuery function и не будет работать с Vanilla JS. Впоследствии вам нужно будет использовать

this.getAttribute("data-parentid")