0
あなたのプロジェクトに別の著者（自由に使用している）からjavascriptコードをインポートする際に、どのような安全性の測定を考慮したいのですか？ super simple navigation template from codepenを見つけた場合は、XMLHttpRequestを含むjsファイルを使用しないと、私はそれが動作しないことがわかりました（このテンプレートのhttp要求が必要なのはなぜですか？ ）ここにはanother exampleには多くのvar宣言と置き換えがあります。他の作者からJavascriptの安全性を判断する例：
このようなシンプルなWebサイトに対してhttpリクエストが必要なのはなぜですか、また、他のユーザーの使用時にどのような測定値が必要なのかを知りたいと思っています。コードを使用することはできません。
!function() {
function e(e, r) {
return [].slice.call((r || document).querySelectorAll(e))
}
if (window.addEventListener) {
var r = window.StyleFix = {
link: function (e) {
try {
if ("stylesheet" !== e.rel || e.hasAttribute("data-noprefix"))return
} catch (t) {
return
}
var n, i = e.href || e.getAttribute("data-href"),
a = i.replace(/[^\/]+$/, ""), o = (/^[a-z]{3,10}:/.exec(a) || [""])[0],
s = (/^[a-z]{3,10}:\/\/[^\/]+/.exec(a) || [""])[0], l = /^([^?]*)\??/.exec(i)[1], u = e.parentNode, p = new XMLHttpRequest;
p.onreadystatechange = function() {
4 === p.readyState && n()
}, n = function() {
var t = p.responseText;
if (t && e.parentNode && (!p.status || p.status < 400 || p.status > 600)) {
if (t = r.fix(t, !0, e), a) {
t = t.replace(/url\(\s*?((?:"|')?)(.+?)\1\s*?\)/gi, function (e, r, t) {
return /^([a-z]{3,10}:|#)/i.test(t) ? e : /^\/\//.test(t) ? 'url("' + o + t + '")' : /^\//.test(t) ? 'url("' + s + t + '")' : /^\?/.test(t) ? 'url("' + l + t + '")' : 'url("' + a + t + '")'
});
var n = a.replace(/([\\\^\$*+[\]?{}.=!:(|)])/g, "\\$1");
t = t.replace(RegExp("\\b(behavior:\\s*?url\\('?\"?)" + n, "gi"), "$1")
}
var i = document.createElement("style");
i.textContent = t, i.media = e.media, i.disabled = e.disabled, i.setAttribute("data-href", e.getAttribute("href")), u.insertBefore(i, e), u.removeChild(e), i.media = e.media
}
};
try {
p.open("GET", i), p.send(null)
} catch (t) {
"undefined" != typeof XDomainRequest && (p = new XDomainRequest, p.onerror = p.onprogress = function() {
}, p.onload = n, p.open("GET", i), p.send(null))
}
e.setAttribute("data-inprogress", "")
}, styleElement: function (e) {
if (!e.hasAttribute("data-noprefix")) {
var t = e.disabled;
e.textContent = r.fix(e.textContent, !0, e), e.disabled = t
}
}, styleAttribute: function (e) {
var t = e.getAttribute("style");
t = r.fix(t, !1, e), e.setAttribute("style", t)
}, process: function() {
e("style").forEach(StyleFix.styleElement), e("[style]").forEach(StyleFix.styleAttribute)
}, register: function (e, t) {
(r.fixers = r.fixers || []).splice(void 0 === t ? r.fixers.length : t, 0, e)
}, fix: function (e, t, n) {
for (var i = 0; i < r.fixers.length; i++)e = r.fixers[i](e, t, n) || e;
return e
}, camelCase: function (e) {
return e.replace(/-([a-z])/g, function (e, r) {
return r.toUpperCase()
}).replace("-", "")
}, deCamelCase: function (e) {
return e.replace(/[A-Z]/g, function (e) {
return "-" + e.toLowerCase()
})
}
};
!function() {
setTimeout(function() {
}, 10), document.addEventListener("DOMContentLoaded", StyleFix.process, !1)
}()
}
}(), function (e) {
function r(e, r, n, i, a) {
if (e = t[e], e.length) {
var o = RegExp(r + "(" + e.join("|") + ")" + n, "gi");
a = a.replace(o, i)
}
return a
}
if (window.StyleFix && window.getComputedStyle) {
var t = window.PrefixFree = {
prefixCSS: function (e, n) {
var i = t.prefix;
if (t.functions.indexOf("linear-gradient") > -1 && (e = e.replace(/(\s|:|,)(repeating-)?linear-gradient\(\s*(-?\d*\.?\d*)deg/gi, function (e, r, t, n) {
return r + (t || "") + "linear-gradient(" + (90 - n) + "deg"
})), e = r("functions", "(\\s|:|,)", "\\s*\\(", "$1" + i + "$2(", e), e = r("keywords", "(\\s|:)", "(\\s|;|\\}|$)", "$1" + i + "$2$3", e), e = r("properties", "(^|\\{|\\s|;)", "\\s*:", "$1" + i + "$2:", e), t.properties.length) {
var a = RegExp("\\b(" + t.properties.join("|") + ")(?!:)", "gi");
e = r("valueProperties", "\\b", ":(.+?);", function (e) {
return e.replace(a, i + "$1")
}, e)
}
return n && (e = r("selectors", "", "\\b", t.prefixSelector, e), e = r("atrules", "@", "\\b", "@" + i + "$1", e)), e = e.replace(RegExp("-" + i, "g"), "-"), e = e.replace(/-\*-(?=[a-z]+)/gi, t.prefix)
}, property: function (e) {
return (t.properties.indexOf(e) ? t.prefix : "") + e
}, value: function (e) {
return e = r("functions", "(^|\\s|,)", "\\s*\\(", "$1" + t.prefix + "$2(", e), e = r("keywords", "(^|\\s)", "(\\s|$)", "$1" + t.prefix + "$2$3", e)
}, prefixSelector: function (e) {
return e.replace(/^:{1,2}/, function (e) {
return e + t.prefix
})
}, prefixProperty: function (e, r) {
var n = t.prefix + e;
return r ? StyleFix.camelCase(n) : n
}
};
!function() {
var e = {}, r = [], n = getComputedStyle(document.documentElement, null), i = document.createElement("div").style, a = function (t) {
if ("-" === t.charAt(0)) {
r.push(t);
var n = t.split("-"), i = n[1];
for (e[i] = ++e[i] || 1; n.length > 3;) {
n.pop();
var a = n.join("-");
o(a) && -1 === r.indexOf(a) && r.push(a)
}
}
}, o = function (e) {
return StyleFix.camelCase(e) in i
};
if (n.length > 0)for (var s = 0; s < n.length; s++)a(n[s]); else for (var l in n)a(StyleFix.deCamelCase(l));
var u = {uses: 0};
for (var p in e) {
var f = e[p];
u.uses < f && (u = {prefix: p, uses: f})
}
t.prefix = "-" + u.prefix + "-", t.Prefix = StyleFix.camelCase(t.prefix), t.properties = [];
for (var s = 0; s < r.length; s++) {
var l = r[s];
if (0 === l.indexOf(t.prefix)) {
var c = l.slice(t.prefix.length);
o(c) || t.properties.push(c)
}
}
"Ms" != t.Prefix || "transform" in i || "MsTransform" in i || !("msTransform" in i) || t.properties.push("transform", "transform-origin"), t.properties.sort()
}(), function() {
function e(e, r) {
return i[r] = "", i[r] = e, !!i[r]
}
var r = {
"linear-gradient": {property: "backgroundImage", params: "red, teal"},
calc: {property: "width", params: "1px + 5%"},
element: {property: "backgroundImage", params: "#foo"},
"cross-fade": {property: "backgroundImage", params: "url(a.png), url(b.png), 50%"}
};
r["repeating-linear-gradient"] = r["repeating-radial-gradient"] = r["radial-gradient"] = r["linear-gradient"];
var n = {
initial: "color",
"zoom-in": "cursor",
"zoom-out": "cursor",
box: "display",
flexbox: "display",
"inline-flexbox": "display",
flex: "display",
"inline-flex": "display",
grid: "display",
"inline-grid": "display",
"min-content": "width"
};
t.functions = [], t.keywords = [];
var i = document.createElement("div").style;
for (var a in r) {
var o = r[a], s = o.property, l = a + "(" + o.params + ")";
!e(l, s) && e(t.prefix + l, s) && t.functions.push(a)
}
for (var u in n) {
var s = n[u];
!e(u, s) && e(t.prefix + u, s) && t.keywords.push(u)
}
}(), function() {
function r(e) {
return a.textContent = e + "{}", !!a.sheet.cssRules.length
}
var n = {
":read-only": null,
":read-write": null,
":any-link": null,
"::selection": null
}, i = {keyframes: "name", viewport: null, document: 'regexp(".")'};
t.selectors = [], t.atrules = [];
var a = e.appendChild(document.createElement("style"));
for (var o in n) {
var s = o + (n[o] ? "(" + n[o] + ")" : "");
!r(s) && r(t.prefixSelector(s)) && t.selectors.push(o)
}
for (var l in i) {
var s = l + " " + (i[l] || "");
!r("@" + s) && r("@" + t.prefix + s) && t.atrules.push(l)
}
e.removeChild(a)
}(), t.valueProperties = ["transition", "transition-property"], e.className += " " + t.prefix, StyleFix.register(t.prefixCSS)
}
}(document.documentElement);
ここにコードがあります。