什么是 W3.JS，W3Schools 为什么要推广它？
[英]What is W3.JS and why is W3Schools promoting it?
5 个解决方案
解决方案1
8 2017-08-29 18:29:45
W3 JS 库有几个吸引人的特性。
1. 它非常轻巧。 2. 没有太多的学习曲线； 我能够在几乎没有文档的情况下“工作”一些东西（除了 w3schools.com，没有太多。）
我在库中尝试了几种不同的功能，这是我的看法。 为了尝试分离关注点，我偶然发现了这个库，以寻找使用类似 PHP 的包含语句来拉入 HTML 片段文件的能力。 W3.JS 提供了向 div 元素添加属性的能力
<div w3-include-html="frags/content.html"></div>
并且使用 JQuery UI 风格的 initialize 语句，文件的内容将被加载到客户端的 div 元素中。
<script>
w3.includeHTML();
</script>
这确实有效，但仅此而已。 我在我继承的遗留应用程序上使用了该库，该应用程序是在服务器端的经典 ASP 中完成的。 我从 JQuery 中依赖的一件事是 AJAX 函数用于向我用作“数据访问层”的原始 ASP 页面发送 POST 请求。 该页面将使用像枚举一样的 POST 变量来告诉它要调用哪个函数，然后是每个函数中需要的后续变量。 下面是 W3.JS 执行 Web 请求的能力的示例，然后使用它的显示对象函数和 HTML 对象（此处为无序列表）显示检索到的 JSON 对象，该对象具有属性“customers”，该对象是大批。 这将生成带有作为每个客户实例属性的 innerHTML 的 LI 元素； “顾客姓名。” ({{CustomerName}}) 是此处的占位符。
<ul id="id01">
<li w3-repeat="customers">{{CustomerName}}</li>
</ul>
<script>
w3.getHttpObject("CommonServerFns.asp?operation=1", controllerFn);
function controllerFn(myObject) {
//myObject looks like {"customers":[{"CustomerName":"Mike Jones"}]}
w3.displayObject("id01", myObject);
}
</script>
因此，即使要尝试上面的示例，我也必须将我的数据页转换为使用 GET 请求的查询字符串，我没有遇到任何问题。 但是，用于代替 JQuery AJAX 请求和 vanilla JS 回调函数，如下所示。
$.ajax({
url: "ServerCommonFns.asp",
type: "POST",
data: '{"operation":1}',
complete: function(jqXHR, statusMsg){
//if status is 200, jqXHR.responseText has my serialized JSON
var retData = JSON.parse(jqXHR.responseText);
var tgtListElement = document.getElementById("id01");
//Clear the placeholder code from the list and go to work...
tgtListElement.innerHTML = "";
for(var index = 0;index<retData.length;index++){
var listNode = document.createElement("li");
listNode.innerHTML = retData[index].CustomerName;
tgtListElement.appendChild(listNode);
}
});
所以 W3JS 看起来像是首选的解决方案，它肯定是更少的代码。 但是，在我开发的应用程序中，我对两种方法的 Web 请求进行了计时，结果令人震惊。 该请求返回了一个大小约为 737K 的 JSON 字符串，该请求大约需要 2.5 秒才能完成。 我的 JQuery 解决方案花费了大约 4.5 秒，包括大约 2.5 秒的请求。 W3.JS 解决方案需要 17 到 27 秒才能完成。 我做了一些调整，认为我犯了一个错误，这是“更好和更快的 Javascript 库”运行不佳的唯一方法，但似乎不是。 我不知道为什么，但 W3 JS 解决方案显然无法在我的应用程序中使用。
上周初我尝试再次使用这个库； 认为数据密集程度较低的应用程序可能会工作得更好。 如果你读了这么多，我会给你多读几行……不是。 这个应用程序将经典 ASP 与另一个“数据访问层”类型的 ASP 页面一起使用，再次与使用 AJAX 函数的 JQuery 和 Vanilla JS 一起使用。 我构建了一个 JS 函数作为参数/函数 ptr 传递，就像这样
var sortAsc = true;
//JSONObj looks like {"faqs":[{id:1,createdBy:"Les Grossman"},
//{id:2,createdBy:"Jeff Portnoy"}]};
var JSONObj = null;
function compareFn(a, b){
if(a.id < b.id) return sortAsc ? 1 : -1;
if(a.id > b.id) return sortAsc ? -1 : 1;
return 0;
}
//Assign my onclick event handler
document.getElementById("faqId").onclick = function(){
JSONObj.sort(compareFn);
sortAsync = !sortAsync;
//Logic below to clear and reload the rows in my HTML table...
//See above example for pretty much identical code
}
这又是代码密集型的，我不想每次单击列标题时都必须触发 Web 请求（使用 SQLite 查询的排序功能）而不是自定义 JS 函数。 所以我尝试使用 w3.sortHTML() 函数来完成这项工作。 它看起来像这样，但我保留了我的 JQuery AJAX 代码来最初加载表，并在加载后使用 sortHTML() 函数进行排序。 w3.sortHTML 函数按此顺序接受参数
- 重复元素容器唯一选择器（“Select、UL、OL、Table 等”）。
- 重复元素组选择器（选项、li、tr 等） 在本例中，我使用 .faq，因为我已将其应用于所有表 -> tr 实例。
要排序的重复组的属性/元素的选择器（内部跟踪升序/降序排序。）
常见问题编号 常见问题名称 1 Tug Speedman 2 Alpa Chino 3 Kirk Lazarus ...
我正在使用此页面显示来自我们 HelpDesk 系统的 FAQ 数据（使用我的登录名将数据抓取到 SQLite 数据库中，因此任何用户都可以查看 FAQ 数据，而无需 Helpdesk 系统的登录名/许可证。）Web 请求返回一个 JSON字符串大小大约为 430 KB，并创建 320 个表行，其中包含 5 个表列（例如，仅对两列进行编码。）此请求需要大约 3 秒才能完成。 我的带有回调函数的 JQuery/JS AJAX 请求总共大约 5.5 秒，包括大约 3 秒的 Web 请求/响应。 我的自定义排序 fn 花费了不到 1 秒的时间，无论按列排序（示例中仅显示 id），对我的 ret 数据 obj（排序为全局对象“JSONObj”）进行排序，清除表格并用排序的行重新填充表格. 同样，有很多代码可以做到这一点，所以我认为 W3 JS 可能会帮助我。 我的 W3 JS 排序实现需要大约 8 秒来对整数/数字数据进行排序，大约需要 10 秒来对文本/字符串数据进行排序。 这对于我的需求（再次）来说太长了，所以我又回到了我的 JQuery/JS 解决方案。
总而言之，在这个库中，任何比普通大小更大的东西都会导致性能非常差。 我认为 W3.JS 的创建者的功能需求是正确的，因为该库确实拥有一些非常有用的抽象功能，但它不能替代 JQuery 和其他现有框架，甚至不能替代您的老式 Javascript 代码。 希望事情已经解决； 真的很有帮助。
编辑 - 所以我一直在浏览库的源代码，虽然有几种 web reqs 的速记方法，但只有一个 w3.http() 具有以下签名的方法。
function (target, readyfunc, xml, method)
除了 xml 只是一个字符串值之外，参数被适当地命名。 我能够使用我之前提到的处理 POST 请求的 ASP 页面来实现这一点。 我是这样调用的。
w3.http("ServerCommonFns.asp", httpCallBack, "operation=1", "post");
function httpCallBack(){
if(this.readyState == 1){
console.log("Setting needed header...");
this.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
}
else if(this.readyState == 4){
console.log("Parsing response....");
//document.getElementById("main").innerHTML = JSON.stringify(this.responseText);
var responseObj = JSON.parse(this.responseText);
var respDataObj = JSON.parse(responseObj.retdata);
var tableObj = document.getElementById("responseTable");
tableObj.innerHTML = "";
for(var index=0;index<respDataObj.length;index++){
var newRow = document.createElement("tr");
newRow.innerHTML = "<td>" + respDataObj[index].MACHINE_ID + "</td>";
tableObj.appendChild(newRow);
}
return false;
}
}
您会看到 httpCallBack 被用作内部 xhr 对象的 onreadystatechange 事件的侦听器，因为它就是这样。 为了在我的实例中工作，我必须在打开请求之前设置内容类型标头，以便正确解释我的 xml/param 参数。 因此 W3.JS 可以执行 POST 请求，但 w3.http() 函数只不过是围绕 Javascript XMLHttpRequest() 对象的简单包装器。 此外，请求是异步调用的，无法更改该行为，仅供参考。
--第二次编辑。 所以我在工作中暂时休息了，我觉得我给 W3.JS 的时间可能少于应有的时间。 今天我尝试了一些事情并检查了来源以获取一些见解。 我找到了一些我觉得至少很整洁的东西，我想我会用它们完成这面文字墙。 下面是我今天所做的事情的来源。 我尝试将一些 W3.JS 函数与我为 MFG Q/A 人员编写的应用程序的现有数据源相结合。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test Page</title>
<script src="https://www.w3schools.com/lib/w3.js"></script>
<script>
var xhrObj = null;
var jsonObj = null;
var sortAsc = true;
function w3ReadyStateChanged(){
if(this.readyState == 1){
console.log("Preparing Request/Setting needed header...");
this.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
}
else if(this.readyState == 4){
console.log("Parsing response....");
//document.getElementById("main").innerHTML = JSON.stringify(this.responseText);
var responseObj = JSON.parse(this.responseText);
if(responseObj.retcode != 1){
console.log("A retcode of: " + responseObj.retcode + " has indicated a failed web request...");
return false;
}
jsonObj = {};
//var respDataObj = JSON.parse(responseObj.retdata);
jsonObj.retdata = JSON.parse(responseObj.retdata);
//
console.log("Starting Display: " + new Date())
w3.displayObject("responseTable", jsonObj);
console.log("Display Finished: " + new Date())
//This is to stop page refresh.
return false;
}
}
function tryw3xhr(){
w3.http("ParCommonFns.asp", w3ReadyStateChanged, "operation=13&useCriteria=false&openPARs=1", "POST");
}
function compareFn(a, b){
if(parseInt(a[0]) > parseInt(b[0]))
return 1;
else if(parseInt(a[0]) < parseInt(b[0]))
return -1;
else
return 0;
}
function sortContainerData(containerElementId, repeatingSelector, sortByIndex){
//w3.sortHTML('#responseTable','tr.dataRow')
var dataObj = {};
var containerElement = document.getElementById(containerElementId);
if(!containerElement){
console.log("Couldn't locate a table or list with ID: " + containerElementId);
return false;
}
//
var sortElements = containerElement.querySelectorAll(repeatingSelector);
if(!sortElements || sortElements.length == 0){
console.log("repeatingSelector failed to yield results: ");
return false;
}
//
dataObj.sortElements = new Array(sortElements.length);
for(var i = 0;i<sortElements.length;i++){
var tempArray = new Array(sortElements[i].children.length);
for(var j = 0;j<sortElements[i].children.length;j++){
tempArray[j] = sortElements[i].children[j].innerHTML;
}
dataObj.sortElements[i] = tempArray;
}
//w3.sortHTML('#responseTable', '.dataRow', 'td')
console.log("Starting Sort: " + new Date());
var t0 = performance.now();
var doCustom = false, didSwap = false;
if(doCustom){
var sortLen = dataObj.sortElements.length;
var j = 0;
//if (parseInt(dataObj.sortElements[i][sortByIndex]) == dataObj.sortElements[i][sortByIndex])
// compareInt = true;
for (var i = 0; i < sortLen - 1; i++){
didSwap = false;
j = i + 1;
while (j < sortLen && parseInt(dataObj.sortElements[i][sortByIndex]) >= parseInt(dataObj.sortElements[j][sortByIndex])) {
j++;
}
//If j equals sortLen, then i is greater than all others so we stick it on top.....
if (i + 1 == j)
break;
if (j == sortLen) {
dataObj.sortElements.push(dataObj.sortElements[i].slice());
dataObj.sortElements.splice(i, 1);
didSwap = true;
} else if (j > (i + 1)) {
dataObj.sortElements.splice(j, 0, dataObj.sortElements[i].slice());
dataObj.sortElements.splice(i, 1);
didSwap = true;
}
if (didSwap)
i--;
//if(i % 50 == 0)
// console.log("Handled: " + i);
}
//This is cheating but it should work.....
if (!sortAsc) dataObj.sortElements.reverse();
}
else{
dataObj.sortElements.sort(compareFn);
}
sortAsc = !sortAsc;
console.log("Sort Time (MS): " + (performance.now() - t0));
//
console.log("Starting Reload: " + new Date()) ;
var containerBody = containerElement.querySelector("tbody");
containerBody.innerHTML = "";
for(var i = 0;i<dataObj.sortElements.length ;i++){
var newRow = document.createElement("tr");
newRow.classList.add("dataRow");
//
for(var j =0;j<dataObj.sortElements[i].length;j++){
var newCol = document.createElement("td");
newCol.innerHTML = dataObj.sortElements[i][j];
newRow.appendChild(newCol);
}
//
containerBody.appendChild(newRow);
}
console.log("Ops complete: " + new Date()) ;
return false;
}
window.onload = function () {
document.getElementById("invokeBtn").disabled = true;
tryw3xhr();
document.getElementById("invokeBtn").disabled = false;
w3.hide("#conditionalContent");
};
//
function runW3JSFn() {
var w3TargetId = "#w3Target";
var w3FunctionsSelect = document.getElementById("w3Functions");
if (w3FunctionsSelect.value == "show") {
w3.show(w3TargetId);
}
else if (w3FunctionsSelect.value == "hide") {
//Doesn't preserve space....
w3.hide(w3TargetId);
}
else if (w3FunctionsSelect.value == "toggle") {
w3.toggleShow(w3TargetId);
}
else if (w3FunctionsSelect.value == "addStyle") {
//But no remove style?
w3.addStyle(w3TargetId, 'border', '2px solid green');
}
else if (w3FunctionsSelect.value == "addClass") {
w3.addClass(w3TargetId, 'w3Class');
}
else if (w3FunctionsSelect.value == "removeClass") {
//Italics should go away.....
w3.removeClass(w3TargetId, 'w3Class');
}
else if (w3FunctionsSelect.value == "toggleClass") {
//Italics should go away.....
w3.toggleClass(w3TargetId, 'w3Class');
}
else if (w3FunctionsSelect.value == "filterTable") {
//Italics should go away.....
document.querySelector(w3TargetId).innerHTML = "<h2> Try an ID # in the box below....</h2>";
}
else { document.querySelector(w3TargetId).innerHTML = "<h2> Invalid function specified....</h2>"; }
}
//
function doVanillaJSFn() {
var w3TargetId = "#w3Target";
var w3FunctionsSelect = document.getElementById("w3Functions");
if (w3FunctionsSelect.value == "show") {
document.querySelector(w3TargetId).style.display = 'block';
}
else if (w3FunctionsSelect.value == "hide") {
//Doesn't preserve space....
document.querySelector(w3TargetId).style.display = 'none';
}
else if (w3FunctionsSelect.value == "toggle") {
var tgtElement = document.querySelector(w3TargetId);
if (tgtElement.style.display == 'block')
tgtElement.style.display = 'none';
else
tgtElement.style.display = 'block';
}
else if (w3FunctionsSelect.value == "addStyle") {
//$(tgtElement).css("attr", "val");
//Works....
document.querySelector(w3TargetId).setAttribute("style", "border: 4px solid green");
//But better.....
if(confirm("Try Better way ?"))
document.querySelector(w3TargetId).border = "4px solid green";
}
else if (w3FunctionsSelect.value == "addClass") {
document.querySelector(w3TargetId).classList.add("w3Class");
}
else if (w3FunctionsSelect.value == "removeClass") {
//Italics should go away.....
document.querySelector(w3TargetId).classList.remove("w3Class");
}
else if (w3FunctionsSelect.value == "toggleClass") {
//Italics should go away.....
var tgtElement = document.querySelector(w3TargetId);
if (tgtElement.classList.contains("w3Class"))
tgtElement.classList.remove("w3Class");
else
tgtElement.classList.add("w3Class");
}
else if (w3FunctionsSelect.value == "filterTable") {
//Italics should go away.....
document.querySelector("#filterCtrl").oninput = function () { myCustomFilter() };
document.querySelector(w3TargetId).innerHTML = "<h2> Try it now....</h2>";
}
else { document.querySelector(w3TargetId).innerHTML = "<h2> Invalid function specified....</h2>"; }
}
function myCustomFilter() {
var tableElement = document.getElementById("responseTable");
var filterData = document.getElementById("filterCtrl").value.trim().toLowerCase();
////
for (var i = 1; i < tableElement.rows.length; i++) {
var foundRowMatch = false;
if (filterData == "") {
tableElement.rows[i].style.display = 'table-row';
continue;
}
for (var j = 0; j < tableElement.rows[i].cells.length; j++) {
var cellSplit = tableElement.rows[i].cells[j].innerHTML.trim().split(' ');
for (var k = 0; k < cellSplit.length; k++) {
if (cellSplit[k].trim().toLowerCase() == filterData) {
foundRowMatch = true;
break;
}
}
if (foundRowMatch) break;
}
// //
if (!foundRowMatch) tableElement.rows[i].style.display = 'none';
else tableElement.rows[i].style.display = 'table-row';
}
//
return false;
}
</script>
<style>
#parHeaders{
background-color: red;
border-bottom: 4px solid black;
}
.w3Class {
font-style:italic;
}
</style>
</head>
<body>
<select id="w3Functions">
<option value="show">Show</option>
<option value="hide">Hide</option>
<option value="toggle">Toggle</option>
<option value="addStyle">Add Style</option>
<option value="addClass">Add Class</option>
<option value="removeClass">Remove Class</option>
<option value="toggleClass">Toggle Class</option>
<option value="filterTable">Filter Table</option>
</select>
<button id="invokeBtn" onclick="runW3JSFn(); return false;">Try w3 function</button>
<button id="invokeBtnAlternate" onclick="doVanillaJSFn(); return false;">Try JS Alternate Function</button>
<div id="w3Target"><h2>This Is My W3 Functions Target!!!!</h2></div>
<br/><br/>
Filter Data By Id: <input id="filterCtrl" type="text" oninput="w3.filterHTML('#responseTable', '.dataRow', this.value);" />
<br/>
<div><table id="responseTable">
<thead>
<tr id="parHeaders">
<th id="parIdHdr" onclick="sortContainerData('responseTable', 'tr.dataRow', 0);return false;">ID</th>
<th id="parTypeHdr">TYPE</th>
<th id="dateSubmittedHdr">SUBMITTED DATE</th>
<th id="priorityLevelHdr">PRIORITY LEVEL</th>
<th id="issueDescHdr">ISSUE DESC</th>
</tr>
</thead>
<tbody>
<tr class = "dataRow" w3-repeat="retdata">
<td>{{PAR_ID}}</td>
<td>{{PAR_TYPE}}</td>
<td>{{DATE_SUBMITTED}}</td>
<td>{{PRIORITY_LEVEL}}</td>
<td>{{ISSUE_DESC}}</td>
</tr>
</tbody>
</table></div>
<div id="conditionalContent"><h2>Loading.......</h2></div>
</body>
</html>
所以我试图做的是使用 w3.http() 从我未修改的数据源中获取一个 JSON 字符串（仍然是经典的 ASP 页面），然后使用 w3.displayObject() 和我检索到的 JSON 对象来填充带有行的表. 我之前尝试过类似的场景，但性能很差，但在我检查的源代码中，我没有看到任何明显的瓶颈，所以我想我会再试一次。 我的网络请求需要大约 9 秒来查询价值 750K 的数据。 我用这个对象重新测试 w3.displayObject 并感到惊讶。 使用上面的占位符，它们只是我解析的 JSON 对象的 {{attribute names}}，我能够在几百毫秒内加载 677 行，每行 5 列。 因此，对于简单的抓取式操作，我认为这是可以接受的。 然后我尝试使用 w3.sortHTML() 函数按第一列（一个整数值）对行进行排序。 当我让它工作时遇到了问题，它花了大约 30 秒才能工作并且它冻结了我的浏览器几次。 然后当它最终打印“已排序”的行时，它们不是按整数或数值排序，而是按字符串排序，因此值“100”后跟值“11”，因为第一个字符匹配，但对于其次，“1”alphachar 高于“0”。 我做了更多的工具，我重新阅读了源代码以确认没有乐趣； 因为这种排序功能对我有很大帮助。 我发现虽然 W3.JS 支持排序列表和表格，但它执行冒泡排序的修改版本，并通过在 DOM 中而不是在内存中删除和插入行/项目来实现。 因此，我将确认我之前的断言，即此功能不是实际的排序实现。
我在上面提到 JS Array 对象有一个排序函数，你可以提供一个 +、0 或 - int 值。 为了进行比较，我编写了自己的函数来对表格进行排序。 它的工作原理是对数组数组进行排序（每个表行列“td”的innerHTML 被放入一个数组中，然后推送到一个包含数组。然后我在第一列（我的 ID 列）上写了一个修改后的冒泡排序。我遇到了一些问题，我花了 2 个多小时才弄好。首先，我花了 3 - 4 次尝试正确地深度复制一个数组。这是我认为应该做的事情，但似乎不是。
var tempArray = new Array(dataObj.sortElements[i]);
什么工作是这样的：
var tempArray = dataObj.sortElements[i].slice();
然后我用这个切掉了我正在移动的数组：
dataObj.sortElements.splice(i, 1);
最后，我再次使用 splice 将数组插入到正确的位置，同时不切割任何索引。 如果它没有遇到更大的比较值，我还使用 push 将其固定在最后。 我的排序功能在按升序对值进行排序时起作用，但是，由于我的数据结构课程完全没有记忆，我无法记住快速修改以进行降序搜索所需的所有内容。 所以我作弊，只是对 Asc 进行排序，然后使用 array.reverse() 来获得我需要的东西。 我为我的自定义函数计时，最坏的情况下排序需要 56 毫秒，最好的情况下需要 0.05 毫秒（越接近排序的表，它的效果越好。）然后我尝试了 array.sort() 函数进行比较。
function compareFn(a, b){
if(parseInt(a[0]) > parseInt(b[0]))
return 1;
else if(parseInt(a[0]) < parseInt(b[0]))
return -1;
else
return 0;
}
//Invoked like so.....
dataObj.sortElements.sort(compareFn);
内置函数在最坏情况下需要 4.5 MS，在最坏情况下需要 2.5 MS。 因此，如果您无法使用数据库引擎对数据进行排序，请节省时间和麻烦，只需使用 array.sort() 即可在除大量数据之外的任何其他内容上获得一致的结果。
至于 W3.JS 的实用函数，我在相邻的函数中实现了 Vanilla JS 解决方案，它们的 util 函数似乎像宣传的那样工作，尽管有些似乎是重复的（例如 addClass、removeClass、toggleClass。只是有一个用于 toggleClass 的参数？）
所以 w3.http，经过一些定制，似乎可以正常工作，w3.displayObject 也值得一试。 最后引起我注意的是具有以下签名的 w3.filterHTML() 函数。 w3.filterHTML('#responseTable', '.dataRow', this.value)
它是您的表/列表的唯一选择器、tr 或 ul 元素的选择器以及要过滤的值（在这种情况下是文本输入的值。）经过一些修补，我能够过滤我检索到的数据使用 w3.http 并使用 w3.displayObject() 显示。 此函数遍历所有行和行的所有单元格，以查看匹配值是否包含在字段的文本中。 无法强制进行数字比较，但响应很快，没有明显的滞后。 因此，对于我的实际最终结论，该库确实提供了一些至少值得为自己进行基准测试的功能，它非常轻巧，但不会将您从 JQuery 中解放出来。 也就是说，您可以在我的示例中看到，W3.JS 可以做的大多数事情也可以在老式的 Vanilla JS 中实现。 在过去的十年中，JQuery 一直是几乎所有 Web 应用程序的依赖项，并且发生了变化，但是如果您继承的 Web 应用程序引用了不能简单替换的过时 JQuery 版本，您会怎么做？ 这发生在我最近的 Web 应用程序项目中，我必须学习如何使用常规 JavaScript 执行大多数 JQuery 函数。 这真的没有那么难，它让我摆脱了另一种外部依赖，而且，我敢说，其中一些还挺有趣。 所以你自己试试吧。 即使您不使用它，您也可能会发现一些有助于存档以备后用的内容。 干杯!
解决方案2
7 已采纳 2017-03-01 20:18:34
W3.JS，这似乎至少是与 jQuery 竞争的部分尝试。
它确实涵盖了与 jQuery 相同的基本领域。 即它是一个 DOM 辅助函数的通用库，添加了 Ajax。
我什至无法从他们以外的任何人那里找到有关它的信息。
那是因为它是他们的库（在名称的开头采用他们的“Slap W3 并希望人们将其与 W3C 联系起来”的方法极端）并且实际上没有其他人会打扰它。
W3Schools 似乎至少有一些倾向将半废弃软件作为下一个伟大的东西来推广。 是这样吗？
看起来确实如此，但那是对未来的推测。
这个库实际上在任何地方使用吗？
无处主要。 一些偶然发现 W3Schools 并通过向 W3Schools 学习迈出 WWW 创作第一步的人正在使用它。 关于它的问题不时出现在 Stackoverflow 上。
有谁知道它的历史（尤其是它的发布历史）
下载页面有一些信息。
它包括W3.JS 可以免费使用的相当无用的声明。 不需要许可证（这是非常模糊的；免费软件许可证的存在是有原因的）。
它的底部还有一个更改日志。
任何地方都没有版本控制存储库的迹象。
如果这真的要发展成真正值得考虑使用的东西？
意见，所以不发表意见。
解决方案3
4 2018-11-02 16:16:42
w3.js = 小巧、强大、直观
看起来有人做了我们不时做的事情：实现一个以前存在的有用框架的一个较小的子集，并只提供 95% 的项目真正使用的那些功能。 那是，
- 添加/删除类、样式、HTML 元素
- Ajax 通信
- 基于模型的 HTML 迭代器（列表）
还有一种非常有用和直接的排序：您看一眼并立即使用它。 它只是有效。 这就是我喜欢 w3.js 的地方——那个和大小，似乎是 13k 未压缩-未缩小。 我什至懒得把它缩小。
我绝对是 jQuery 的粉丝； 它改变了我们的思维方式，成为事实上的标准，这是有原因的。 但是今天大部分 Sizzle 部分是在浏览器本身中实现的，因此主要优势在没有 jQuery 的情况下也可用。
解决方案4
2 2017-03-01 20:20:11
我不确定你为什么要问这个问题，确切地说； 如果您担心 jQuery 以某种方式不足，请不要担心：jQuery 是一个出色的库，它将在很长很长一段时间内继续成为 JS 社区的一部分。
W3Schools 将自己推销为面向全新编程学生的易于获取的资源，因此其网站上采用了欢快的配色方案，并且文章中使用了简化的语言。 他们可能试图迎合那些对 jQuery 的复杂性感到害怕的用户。 但是，这种尝试是否会成功，我无法确定。
解决方案5
2 2018-03-28 07:36:17
W3.js 是一个小型的、易于排除故障的帮助程序库，具有修剪功能。 我在快速、组合在一起的应用程序中使用它，因为我发现它更容易进行故障排除和记录，而且对于不熟悉 jQuery 广泛功能集的人来说更容易接近。 它有点像一个非优化的、“无文化”的 jQuery，因为它几乎不依赖于部落/文化知识而易于理解。
我没有看到 W3schools 去任何地方，它被源源不断的新手开发人员经常光顾，这似乎是其 w3.css 和 w3.js 的目标。 如果您确实使用它，我可能会回避从他们的站点/CDN 链接它。 最好有一个本地副本，否则如果/当文件不可用时，您的站点可能会无法正常运行。 我也不会在大规模生产应用程序中信任它，因为正如其他人所提到的那样，注意到其代码问题的人可能没有充分使用它。 我知道我只将它用于宠物项目，老实说，我从未挖掘过源头。 （我现在可能会考虑这个问题）
为什么 Fullscreen API w3schools 示例在 Firefox 中不起作用
[英]Why is the Fullscreen API w3schools example not working in Firefox
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.