js 중의attributes와attribute의 용법과 차이에 대해 간단히 말하다
5519 단어 jsattributesAttribute
getAttribute: 속성 값 가져오기;
setAttribute: 속성을 만들고 속성에 값을 묶습니다.
createAttribute: 속성만 만들기;
removeAttribute: 속성 삭제;
getAttributeNode: 노드를 대상으로 가져오기;
setAttributeNode: 노드 만들기;
removeAttributeNode: 노드 삭제하기;
1.getAttribute:
<body>
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d=document.getElementById("sss").getAttribute("value");
console.log(d) //aaa;
</script>2.setAtribute:
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.createAttribute("good");
document.getElementById("sss").setAttributeNode(d);
alert(document.getElementById("t").innerHTML) // <input type="hidden" id="sss" value="aaa" good="">; // good; ； 。
</script>
// obox.setAttribute("a","b") undifined; a;
// b; ， / ;
// , ， html 。
<body>
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.createAttribute("good");
document.getElementById("sss").setAttributeNode(d);
alert(document.getElementById("t").innerHTML) // <input type="hidden" id="sss" value="aaa" good="">;
// ,
</script>
<body>
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getElementById("sss").getAttributeNode("value") console.log(d) // value="aaa"
document.getElementById("sss").removeAttributeNode(d);
alert(document.getElementById("t").innerHTML); // <input type = "hidden" id = "sss">;
// value
</script>1. createAttribute는 사용할 때 대상에 기반한 문서가 필요하지 않습니다.createAttribute()를 사용하면 됩니다.
2. setAttribute,createAttribute를 사용할 때 사용할 때name,type,value 등 단어를 사용하지 마십시오.
3. createAttribute를 사용할 때 이름만 정의하면 d.nodeValue ='hello'가 없습니다.문장 정의 값, FF는 빈 문자열, IE는 undefined로 간주됩니다.
get Attribute Node,set Attribute Node,remove Attribute Node 세 가지 방법의 특징은 모두 하나의 node(노드)를 직접 조작하는 것이다.
예:
<body>
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.createAttribute("good");
document.getElementById("sss").setAttributeNode(d);
alert(document.getElementById("t").innerHTML); // <input type="hidden" id="sss" value="aaa" good="">;
</script>요소에 지정된 이름의 속성이 존재하면 이 속성은 새 속성으로 대체됩니다.새 속성이 기존 속성을 대체하면 대체된 속성을 반환하고 그렇지 않으면 NULL을 반환합니다.
======================================================================
2:attributes의 사용법:
attributes는 하나의 대상에 대한 속성을 얻을 수 있고 대상으로 호출할 수 있습니다. 여기서'[]'를 사용해야 합니다.attributes 속성은 지정된 노드 속성의 집합을 되돌려줍니다.length 속성을 사용하여 속성의 수량을 확정하고 모든 속성 노드를 돌아다니며 원하는 정보를 추출할 수 있습니다.각 속성은 사용 가능한 속성 노드 객체입니다.
노드의 방법, 접두사는 반드시 노드이다.
대상attributes//모든 속성 노드를 획득하여 하나의 그룹으로 되돌려줍니다. (위수 그룹)
<body>
<div id = "t">
<input type = "text" id = "sss" value = "aaa">
</body>
<script type="text/javascript">
var a=document.getElementById("sss").attributes;
console.log(a); //NamedNodeMap {0: type, 1: id, 2: value, type: type, id: id, value: value, length: 3}; //attributes , ( );
// attributes ， ， “[]”
var d = document.getElementById("sss").attributes["value"];
console.log(typeof d); // object
console.log(d); // value="aaa";
document.write(d.name); // value
document.write(d.value); // aaa
</script>
<body>
<div class="box" a="10" b="20" id="cont"></div>
</body>
<script>
var obox=document.querySelector(".box");
console.log(obox.attributes[3]) //id="cont";
console.log(typeof obox.attributes[3]) //object;
console.log(obox.attributes[3].nodeName); //id;
console.log(obox.attributes[3].nodeValue); //cont;
console.log(obox.attributes[3].nodeType); //2; 2
</script>이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
[2022.04.19] 자바스크립트 this - 생성자 함수와 이벤트리스너에서의 this18일에 this에 대해 공부하면서 적었던 일반적인 함수나 객체에서의 this가 아닌 오늘은 이벤트리스너와 생성자 함수 안에서의 this를 살펴보기로 했다. new 키워드를 붙여 함수를 생성자로 사용할 때 this는...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
