I created the class below, but I want to substitute the thumbnailIMG declared outside the if statement inside the if statement, but the value is not substituted.
I just started writing code in javascript, so I went to Google to find out about the block scope, and it should be available inside for variables declared outside the block.
The following works as expected.
letel='Moji'
if(el){
el = 'Characters';
console.log(el);
}
I'm sorry.I don't know the cause.
code
class thumbnail {
constructor(){
This.DOM = {}
This.DOM.inputURL= document.querySelectorAll('.dlcard__url>input');
This.DOM.dlcardWrap= document.querySelector(".dlcardWrap";
This._addEvent();
}
_putThumbnail(){
This.DOM.dlcardIMGs= document.querySelectorAll('.dlcard__thumbnail>img');
This.DOM.dlcardIMGs.forEach(el)=>{
el.addEventListener();
});
}
_addEvent(){
This.params={}
This.DOM.dlcardWrap.addEventListener("blur",
function(elm){
const input =elm.target;
if(input.parentElement.classList.contains("dlcard__url")}
const url = new URL (input.value)
let pairs=url.search.substring(1).split('&');
let params = {}
for (let pair of pairs) {
let kv = pair.split('=');
params[kv[0]]=kv[1];
}
let videoID = params.v;
let dlcard = input.closeest('.dlcard');
let thumbnailIMG = dlcard.childNodes[3].childNodes[1].src;
if(videoID){
let thumbnailURL=`https://img.youtube.com/vi/$ {videoID}/maxresdefault.jpg`;
thumbnailIMG = thumbnailURL;
} else {
console.log('through')
}
}
}, true);
}
}
new thumbnail();
It should also be used in vscode.
add
Before change
let thumbnailIMG=dlcard.childNodes[3].childNodes[1].src;
After the change
let thumbnailIMG=dlcard.childNodes[3].childNodes[1];
The behavior was referenced and expected by thumbnailIMG.src
in the if statement.
However, I don't understand the meaning of changing behavior when src
is attached. I thought Python would work fine, so it's difficult.
The problem is not the scope, but this.DOM.dlcardWrap= document.querySelector (the constructor in the class described in , declaring variables equal to the query selector of the element without checking for success. ..dlcardWrap";
The constructor is called when you create a new class that appears to be just after the class is created, but html is not displayed here.
If you create a class before you create HTML, the Query Selector will not function at all.You must place the class declaration in the online event in the body of the page or move all JavaScript to the end of all HTML codes.
© 2024 OneMinuteCode. All rights reserved.