기본 틀
항공권 잘 연결한 버전
<script>
// 미리 문자열 배열을 저장해둡니다.
const savedStrings = ["3박4일남자만 연결된 글 ", "3박4일여자만 연결된 글", "4박5일여자만연결된 글", "IN인천 11:30 OUT런던 12:30", "IN롤롤 11:30 OUT런던 12:30"];
const savedAirlines = ["3박4일남자만", "3박4일여자만", "4박5일여자만", "5박4일모두", "1박2일"];
let matchStrings= []; // matchStrings를 let으로 변경하여 재할당할 수 있도록 수정합니다.
let matchStringsInfo = []; // 매치된 문자열과 해당하는 아이템의 수를 저장할 배열을 선언합니다.
let stringRow = []; // 전체 notion-collection-item 문자열을 저장할 배열을 선언합니다.
// 저장된 배열과 데이터 블록 아이디가 포함한 문자열 중 겹치는 것을 찾는 함수를 정의합니다.
function findMatchingString(dataBlockId) {
const button = document.querySelector(`[data-block-id="${dataBlockId}"]`);
const items = Array.from(button.querySelectorAll(".notion-collection-item"));
let matchedString = null;
let matchedItemCount = 0; // 매치된 아이템의 수를 저장할 변수를 초기화합니다.
// stringRow 배열 초기화
stringRow = [];
for (let i = 0; i < savedAirlines.length; i++) {
const savedString = savedStrings[i];
const savedAirline = savedAirlines[i];
for (const item of items) {
if (item.textContent.includes(savedAirline)) {
matchedString = savedString;
matchedItemCount++; // 매치된 아이템의 수를 증가시킵니다.
// 중복되지 않는 경우에만 matchStrings 배열에 추가합니다.
if (!matchStrings.includes(matchedString)) {
matchStrings.push(matchedString);
}
}
stringRow.push(item.textContent.trim()); // 모든 문자열을 stringRow 배열에 추가합니다.
}
// 매치된 아이템의 수와 문자열을 matchStringsInfo 배열에 추가합니다.
if (matchedItemCount > 0) {
matchStringsInfo.push({string: matchedString, count: matchedItemCount});
}
// 변수를 초기화합니다.
matchedString = null;
matchedItemCount = 0;
}
}
// matchStrings 배열을 순회하여 각 문자열에 대해 새로운 collection_block div를 추가하는 함수를 정의합니다.
function addNewCollectionBlocks() {
matchStrings.forEach(matchedString => {
addNewCollectionBlock(matchedString);
});
}
// 새로운 collection_block div를 추가하는 함수를 정의합니다.
function addNewCollectionBlock(matchedString) {
const slide = document.querySelector('.slide');
const newButton = document.createElement('div');
newButton.classList.add('button');
newButton.innerHTML = `
<button type="button" onclick="location.href='https://wannago.oopy.io/why/rodlsdugod'" class="card">
<div class="card_text">
<a class="head"><b>${getAssociatedAirline(matchedString)}</b></a><br>
<div class="middle_box">
<a class="middle">${matchedString}</a><br>
</div>
<div class="container container${slide.children.length + 1}">
<!-- 아이템들이 추가될 곳입니다. -->
</div>
</div>
</button>
`;
slide.appendChild(newButton); // 변수명 수정 및 추가된 버튼을 slide에 추가합니다.
// 매치된 아이템의 수를 찾아 해당하는 container에 텍스트를 추가합니다.
const container = newButton.querySelector(`.container${slide.children.length}`);
const matchedItem = matchStringsInfo.find(item => item.string === matchedString);
if (matchedItem) {
// "남자"가 몇 번 포함되어 있는지 카운트합니다.
const maleCount = (matchedString.match(/남자/g) || []).length;
const femaleCount = matchedItem.count - maleCount; // 전체 수에서 "남자" 수를 뺀 나머지가 "여자"의 수입니다.
// "남자"의 수만큼 item1을 추가합니다.
for (let i = 0; i < maleCount; i++) {
container.insertAdjacentHTML('beforeend', `<div class="item1"></div>`);
}
// "여자"의 수만큼 item2를 추가합니다.
for (let i = 0; i < femaleCount; i++) {
container.insertAdjacentHTML('beforeend', `<div class="item2"></div>`);
}
container.insertAdjacentHTML('beforeend', `<div class="add-text">. . .<b>${matchedItem.count}명</b>이 함께하는 중!</div>`);
// 아이템 개수가 5개를 초과하는 경우 초과된 아이템을 제거합니다.
const itemsInContainer = container.querySelectorAll('.item');
if (itemsInContainer.length > 5) {
for (let i = 5; i < itemsInContainer.length; i++) {
itemsInContainer[i].remove();
}
}
}
}
// matchedString에 해당하는 항공사를 가져오는 함수를 정의합니다.
function getAssociatedAirline(matchedString) {
const index = savedStrings.indexOf(matchedString);
if (index !== -1 && index < savedAirlines.length) {
return savedAirlines[index];
}
return "";
}
// findMatchingString 함수를 실행하여 matchStrings 배열을 채운 후, addNewCollectionBlocks 함수를 호출하여 div를 추가합니다.
findMatchingString("86ca869f-be7d-4858-9d72-d0854151227d");
addNewCollectionBlocks();
// matchStringsInfo 배열과 stringRow 배열을 출력합니다.
console.log(matchStringsInfo);
console.log(stringRow);
// 'in'으로 시작하는 문자열을 <a class="middle"> 태그 안에 자동으로 추가합니다.
addStringsWithInToMiddle();
</script>
Arduino
복사
