文字列を分割 split

const myUrl = 'https://atelierroi.com/?id=123456&name=neko&age=10';
console.log(myUrl.split('&')); //配列

const myUrl2 = 'https://atelierroi.com/?id=123456&name=neko&age=10';
console.log(myUrl2.split(/&|\?/)); //配列

空文字を入れると1文字ずつ分割

const txt = '猫の森';
console.log(txt.split('')); //

文字列の結合

const neko1 = '猫の';
const neko2 = '家';
const neko3 = 'ご飯';
console.log(neko1 + neko2); //猫の家
console.log(neko1 + neko3); //猫のご飯

//``を用いても結合する
console.log(`${neko1}${neko2}`); //猫の家

入力文字の合体

株・有　 会社名　

<label>株・有　<input id="kabu" class="moji" type="text"></label>
<label>会社名　<input id="name" class="moji" type="text"></label>
<p id="fullname"></p>

const Kabu = document.querySelector('#kabu');
const Name = document.querySelector('#name');
const Fullname = document.querySelector('#fullname');
Kabu.addEventListener('keyup', onKeyUp);
Name.addEventListener('keyup', onKeyUp);
function onKeyUp () {
  const Kabu2 = Kabu.value;
  const Name2 = Name.value;
  Fullname.innerHTML = Kabu2 + Name2;
};

大文字、小文字変換

console.log('NEKO'.toLowerCase());  //neko
console.log('tama'.toUpperCase());  //TAMA

警告を表示する　　AIUEO、aiueoを入れた場合に警告

const Txtin = document.querySelector('#txtin');
const Keikoku = document.querySelector('#keikoku');
Txtin.addEventListener('input' , () => {
  const inputtxt = Txtin.value;
  const normaltxt = inputtxt.toLowerCase();
  if(normaltxt.includes('aiueo') === true){
    Keikoku.textContent = 'aiueoが入りました';
} else {
    Keikoku.textContent = 'aiueoではありません';
};
});

複数行の文字列を扱う

const Sname = '佐藤';
console.log('<p>私の名前は' + Sname + 'です。</p>');  //  <p>私の名前は佐藤です。</p>

const Mname = '鈴木';
const mname = `<p>私の名前は${Mname}です。</p>`;
console.log(mname);  //  <p>私の名前は鈴木です。</p>

const Keisan = `10×10は ${10*10} です。`;
console.log(Keisan); //  10×10は 100 です。

今日の日付を出す

<p class="todaydt"></p>
<p class="todaydt2"></p>

const today = new Date();
document.querySelector('.todaydt').innerHTML= today;
document.querySelector('.todaydt2').innerHTML = `
${today.getMonth() + 1} 月 ${today.getDate()} 日`;

innerHTMLとtextContentの違い

↓innerHTMLはhtmlが反映されて出力

↓textContentはタグごと出力

<p class="intxt"></p>
<p class="intxt2"></p>

const chigai = '<b>テキスト</b>';
document.querySelector('.intxt').innerHTML = chigai;
document.querySelector('.intxt2').textContent = chigai;