JavaScript 태그 의 data - xxx 속성 값 분석 (script 태그 의 속성 분석)
5349 단어 web
<script type="text/javascript">
console.log(1-2);
script>
//
<script src="//a.com/tools.min.js">script>외부 js 를 도입 할 때 일부 코드 는 동적 으로 값 을 확정 하거나 설정 을 지정 하여 서로 다른 효 과 를 실현 해 야 합 니 다.
예:
"//a.com/tools.min.js"</span> <span class="hljs-typedef"><span class="hljs-keyword">data</span>-<span class="hljs-keyword">type</span>="open">
// tools.min.js data-type 방법 1:
사용자 가 script 탭 을 정의 할 때 id 를 정의 하도록 규정 합 니 다.
var dom = document.getElementById("xx");
var val = dom.getAttribute("xxx");
그러나 이런 한 계 는 매우 커서 이 방법 을 추천 하지 않 는 다.
방법 2:
html 5 의 새로운 기능 dataset 속성 을 통 해 구현
<html>
<head>
<title> JavaScript data-xxx title>
<meta charset="utf-8" />
head>
<body>
body>
<script data-type="11" data-json='{"a":"a","b":1}' data-aaa-bbb="aaa" type="text/javascript">
/**
* script
* @param {Object} window
*/
function currentScript(window) {
var document = window.document;
return document.currentScript || (function() {
var scripts = document.getElementsByTagName("script");
return scripts[scripts.length - 1];
})();
}
/**
* data attr
* @param {Object} tag
*/
function parseDataAttr(tag) {
var options = {};
for(var opt in tag.dataset) {
if(tag.dataset.hasOwnProperty(opt)) {
try {
options[opt] = JSON.parse(tag.dataset[opt]);
} catch(_) {
options[opt] = tag.dataset[opt];
}
}
}
return options;
}
//
var opt = parseDataAttr(currentScript(window));
console.log(opt)
script>
html>브 라 우 저가 dataset 방법 을 지원 하 는 지 판단 하기:
https://html5demos.com/dataset/
https://www.w3schools.com/tags/att_global_data.asp
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Portswigger의 연구실 작성: CSRF 토큰 보호를 사용한 기본 클릭재킹이 견습생 수준 실습에서는 일부 CSRF 토큰 보호가 있음에도 불구하고 클릭재킹에 취약한 웹사이트에서 계정 삭제 흐름을 악용합니다. 주어진 자격 증명으로 로그인하면 계정 페이지로 이동한 후 사용자 계정을 삭제하는 데...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
