반응형
JavaScript 객체의 src 및 id를 사용하여 JQuery로 새 img 태그를 만드는 방법은 무엇입니까?
나는 JQuery를 기본적인 의미로 이해하지만 확실히 처음이며 이것이 매우 쉽다고 생각합니다.
JSON 응답 (객체로 변환 됨)에 내 이미지 src 및 id가 있으므로 responseObject.imgurl 및 responseObject.imgid에 올바른 값이 있으므로 이제 이미지를 만들어 추가하고 싶습니다. div (라고 부릅니다 <div id="imagediv">
. 저는 동적으로 빌드하는 데 약간 갇혀 있습니다 . 내가 <img src="dynamic" id="dynamic">
본 대부분의 예제는 기존 이미지에서 src를 교체하는 것과 관련이 있지만 기존 이미지가 없습니다.
jQuery에서는 아래와 같이 HTML 문자열을 생성자에 전달하여 새 요소를 만들 수 있습니다.
var img = $('<img id="dynamic">'); //Equivalent: $(document.createElement('img'))
img.attr('src', responseObject.imgurl);
img.appendTo('#imagediv');
var img = $('<img />', {
id: 'Myid',
src: 'MySrc.gif',
alt: 'MyAlt'
});
img.appendTo($('#YourDiv'));
.attr
속성을 jQuery 생성자 에 전달하여 아예 피함으로써 일부 바이트를 절약 할 수 있습니다 .
var img = $('<img />',
{ id: 'Myid',
src: 'MySrc.gif',
width: 300
})
.appendTo($('#YourDiv'));
IE 8에서 동일한 기능이 필요한 사람들을 위해 다음과 같이 문제를 해결했습니다.
var myImage = $('<img/>');
myImage.attr('width', 300);
myImage.attr('height', 300);
myImage.attr('class', "groupMediaPhoto");
myImage.attr('src', photoUrl);
IE8이 생성자에서 개체를 사용하도록 강제 할 수 없습니다.
반응형
'developer tip' 카테고리의 다른 글
WebSocket에서 서버 재부팅시 클라이언트 재 연결 (0) | 2020.09.15 |
---|---|
Vim에서 주석의 글꼴 색상 변경 (0) | 2020.09.15 |
Eclipse Juno / Kepler / Luna CDT에서 C ++ 11을 활성화하는 방법은 무엇입니까? (0) | 2020.09.15 |
Android Studio를 사용한 디버깅이 "Waiting For Debugger"에서 영원히 멈춤 (0) | 2020.09.15 |
Rails 3 : Ajax 호출에서 "redirect_to"하는 방법? (0) | 2020.09.15 |