programing

ID를 가진 CreateElement?

nicescript 2023. 2. 2. 21:24
반응형

ID를 가진 CreateElement?

이 div 항목에 ID를 부여하기 위해 이 코드를 수정하려고 하는데, 구글에서 아무것도 찾을 수 없고 idName이 작동하지 않습니다.append에 대해 읽은 적이 있습니다만, 매우 간단해 보이는 작업치고는 상당히 복잡한 것 같습니다만, 다른 방법이 있을까요?감사합니다:)

g=document.createElement('div'); g.className='tclose'; g.v=0;

다음 방법을 사용해야 합니다.

g = document.createElement('div');
g.setAttribute("id", "Div1");

사용할 수 있습니다.g.id = 'desiredId'예를 들어 작성한 요소의 ID를 설정합니다.

var g = document.createElement('div');
g.id = 'someId';

사용할 수 있습니다.

예:

g.setAttribute("id","yourId")

g.setAttribute("class","tclose")


이 작업을 보다 효율적으로 수행하기 위한 저의 기능은 다음과 같습니다.

function createElement(element, attribute, inner) {
  if (typeof(element) === "undefined") {
    return false;
  }
  if (typeof(inner) === "undefined") {
    inner = "";
  }
  var el = document.createElement(element);
  if (typeof(attribute) === 'object') {
    for (var key in attribute) {
      el.setAttribute(key, attribute[key]);
    }
  }
  if (!Array.isArray(inner)) {
    inner = [inner];
  }
  for (var k = 0; k < inner.length; k++) {
    if (inner[k].tagName) {
      el.appendChild(inner[k]);
    } else {
      el.appendChild(document.createTextNode(inner[k]));
    }
  }
  return el;
}

예 1:

createElement("div");

이 반환됩니다.

<div></div>

예 2:

createElement("a",{"href":"http://google.com","style":"color:#FFF;background:#333;"},"google");`

이 반환됩니다.

<a href="http://google.com" style="color:#FFF;background:#333;">google</a>

예 3:

var google = createElement("a",{"href":"http://google.com"},"google"),
    youtube = createElement("a",{"href":"http://youtube.com"},"youtube"),
    facebook = createElement("a",{"href":"http://facebook.com"},"facebook"),
    links_conteiner = createElement("div",{"id":"links"},[google,youtube,facebook]);

이 반환됩니다.

<div id="links">
    <a href="http://google.com">google</a>
    <a href="http://youtube.com">youtube</a>
    <a href="http://facebook.com">facebook</a>
</div>

새 요소를 만들고 속성을 설정하고 하위 요소를 추가할 수 있습니다.

createElement("tag",{attr:val,attr:val},[element1,"some text",element2,element3,"or some text again :)"]);

특성 또는 하위 요소에는 제한이 없습니다.

jQuery를 사용하여 이 작업을 수행하는 것이 어떨까요?

var newDiv= $('<div/>', { id: 'foo', class: 'tclose'})
var element = document.createElement('tagname');    

element.className= "classname";
element.id= "id";

네가 원하는걸 먹어봐

CSS에서 스타일링을 할 수 있도록 ID를 설정하려고 하는지는 잘 모르겠습니다만, 그럴 경우 다음 작업을 시도해 보십시오.

var g = document.createElement('div');    

g.className= "g";

그러면 네 디바의 이름이 정해지니까 그걸 노릴 수 있을 거야

ID를 가진 새로운 요소를 만드는 것만으로 간단합니다.

var myCreatedElement = document.createElement("div");
var myContainer = document.getElementById("container");

//setAttribute() is used to create attributes or change it:
myCreatedElement.setAttribute("id","myId");

//here you add the element you created using appendChild()
myContainer.appendChild(myCreatedElement);

그게 다야

window.addEventListener('DOMContentLoaded', (event) => {
    var g = document.createElement('div');
    g.setAttribute("id", "google_translate_elementMobile");
    
  document.querySelector('Selector will here').appendChild(g);
});

언급URL : https://stackoverflow.com/questions/9422974/createelement-with-id

반응형