JavaScriptの検索日付と選択タグ

Question

selectタグを使用して月と年で特定の日付を見つける検索をしようとしています.txtに月の値と年の値が含まれている場合は、警告が表示されるようにしたいが、私はあなたがDOMノードにindexOfメソッドを呼び出そうとしているtxt.indexOf is not a function

var txt = document.getElementById('txt'); 
 
today = new Date(); 
 

 
txt.innerHTML = ('' + today.toLocaleDateString() + ' ' + today.getHours() + ':' + today.getMinutes()); 
 

 
var month = document.getElementById('month'); 
 
var year = document.getElementById('year'); 
 
var btn = document.getElementById('btn'); 
 

 
btn.addEventListener('click',() => { 
 
    if (txt.indexOf(month.value) & txt.indexOf(year.value)) { 
 
    alert('yay'); 
 
    console.log('yay'); 
 
    } 
 
});

<p id="txt"></p> 
 

 
<select id="month"> 
 
    <option>1</option> 
 
    <option>2</option> 
 
    <option>3</option> 
 
    <option>4</option> 
 
    <option>5</option> 
 
    <option>6</option> 
 
    <option>7</option> 
 
    <option>8</option> 
 
    <option>9</option> 
 
    <option>10</option> 
 
    <option>11</option> 
 
    <option>12</option> 
 
</select> 
 

 
<select id="year"> 
 
    <option>2016</option> 
 
    <option>2017</option> 
 
    <option>2018</option> 
 
</select> 
 

 
<button id="btn"> 
 
    search 
 
</button>

Answer 1

エラーが発生します。その方法はありません。

indexOfはここ

はあなたのコードは、（実装と恋にないですが、それは適切にするために、今コミットすることはできません）正常に動作するように修正され... arraysとstringsに呼び出すことができる方法です。

• のconstに2017年alert()
• スイッチを使用しないでください/の代わりにVAR
• でみましょう、あなたのコードの構造は、

var txtElement = document.getElementById('txt'); 
 
today = new Date(); 
 

 
var dateString = '' + today.toLocaleDateString() + ' ' + today.getHours() + ':' + today.getMinutes(); 
 
txtElement.innerHTML = dateString; 
 
txtElement.setAttribute('data-month', today.getMonth() + 1); 
 
txtElement.setAttribute('data-year', today.getFullYear()); 
 

 
var month = document.getElementById('month'); 
 
var year = document.getElementById('year'); 
 
var btn = document.getElementById('btn'); 
 

 
btn.addEventListener('click',() => { 
 
    var currentMonth = txtElement.getAttribute('data-month'); 
 
    var currentYear = txtElement.getAttribute('data-year'); 
 
    if (currentMonth === month.value & currentYear === year.value) { 
 
    alert('yay'); 
 
    console.log('yay'); 
 
    } 
 
});

<p id="txt"></p> 
 

 
<select id="month"> 
 
    <option>1</option> 
 
    <option>2</option> 
 
    <option>3</option> 
 
    <option>4</option> 
 
    <option>5</option> 
 
    <option>6</option> 
 
    <option>7</option> 
 
    <option>8</option> 
 
    <option>9</option> 
 
    <option>10</option> 
 
    <option>11</option> 
 
    <option>12</option> 
 
</select> 
 

 
<select id="year"> 
 
    <option>2016</option> 
 
    <option>2017</option> 
 
    <option>2018</option> 
 
</select> 
 

 
<button id="btn"> 
 
    search 
 
</button>

まあ

Answer 2

、のために再考1つ、ElementクラスはにはindexOfを持っていません。getElementByIdは配列を返しません。私がお勧めするのは、代わりにtxt変数か何かのinnerHTMLプロパティを使用して記述することです。

注：Babelとeslint-config-airbnbを使用しているため、スタイルが異なる場合があります。

const txt = document.getElementById('txt'); 
const today = new Date(); 

txt.innerHTML = `${today.toLocaleDateString()} ${today.getHours()}:${today.getMinutes()}`; 

const month = document.getElementById('month'); 
const year = document.getElementById('year'); 
const btn = document.getElementById('btn'); 

btn.addEventListener('click',() => { 
    const value = txt.innerHTML; 
    if (value.includes(month.value) && value.includes(year.value)) { 
    alert('yay'); // eslint-disable-line no-alert 
    console.log('yay'); // eslint-disable-line no-console 
    } 
});