array(2) { ["docs"]=> array(10) { [0]=> array(10) { ["id"]=> string(3) "428" ["text"]=> string(77) "Visual Studio 2017 单独启动MSDN帮助（Microsoft Help Viewer）的方法" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具，而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(8) "DonetRen" ["tagsname"]=> string(55) "Visual Studio 2017|MSDN帮助|C#程序|.NET|Help Viewer" ["tagsid"]=> string(23) "[401,402,403,"300",404]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511400964" ["_id"]=> string(3) "428" } [1]=> array(10) { ["id"]=> string(3) "427" ["text"]=> string(42) "npm -v；报错 cannot find module "wrapp"" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具，而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(4) "zzty" ["tagsname"]=> string(50) "node.js|npm|cannot find module "wrapp“|node" ["tagsid"]=> string(19) "[398,"239",399,400]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511400760" ["_id"]=> string(3) "427" } [2]=> array(10) { ["id"]=> string(3) "426" ["text"]=> string(54) "说说css中pt、px、em、rem都扮演了什么角色" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具，而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(12) "zhengqiaoyin" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511400640" ["_id"]=> string(3) "426" } [3]=> array(10) { ["id"]=> string(3) "425" ["text"]=> string(83) "深入学习JS执行--创建执行上下文（变量对象，作用域链，this）" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具，而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(7) "Ry-yuan" ["tagsname"]=> string(33) "Javascript|Javascript执行过程" ["tagsid"]=> string(13) "["169","191"]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511399901" ["_id"]=> string(3) "425" } [4]=> array(10) { ["id"]=> string(3) "424" ["text"]=> string(30) "C# 排序技术研究与对比" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具，而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(9) "vveiliang" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(8) ".Net Dev" ["catesid"]=> string(5) "[199]" ["createtime"]=> string(10) "1511399150" ["_id"]=> string(3) "424" } [5]=> array(10) { ["id"]=> string(3) "423" ["text"]=> string(72) "【算法】小白的算法笔记：快速排序算法的编码和优化" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具，而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(9) "penghuwan" ["tagsname"]=> string(6) "算法" ["tagsid"]=> string(7) "["344"]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511398109" ["_id"]=> string(3) "423" } [6]=> array(10) { ["id"]=> string(3) "422" ["text"]=> string(64) "JavaScript数据可视化编程学习（二）Flotr2，雷达图" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具，而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(7) "chengxs" ["tagsname"]=> string(28) "数据可视化|前端学习" ["tagsid"]=> string(9) "[396,397]" ["catesname"]=> string(18) "前端基本知识" ["catesid"]=> string(5) "[198]" ["createtime"]=> string(10) "1511397800" ["_id"]=> string(3) "422" } [7]=> array(10) { ["id"]=> string(3) "421" ["text"]=> string(36) "C#表达式目录树（Expression）" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具，而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(4) "wwym" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(4) ".NET" ["catesid"]=> string(7) "["119"]" ["createtime"]=> string(10) "1511397474" ["_id"]=> string(3) "421" } [8]=> array(10) { ["id"]=> string(3) "420" ["text"]=> string(47) "数据结构 队列_队列实例：事件处理" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具，而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(7) "idreamo" ["tagsname"]=> string(40) "C语言|数据结构|队列|事件处理" ["tagsid"]=> string(23) "["246","247","248",395]" ["catesname"]=> string(12) "数据结构" ["catesid"]=> string(7) "["133"]" ["createtime"]=> string(10) "1511397279" ["_id"]=> string(3) "420" } [9]=> array(10) { ["id"]=> string(3) "419" ["text"]=> string(47) "久等了,博客园官方Android客户端发布" ["intro"]=> string(288) "目录 ECharts 异步加载 ECharts 数据可视化在过去几年中取得了巨大进展。开发人员对可视化产品的期望不再是简单的图表创建工具，而是在交互、性能、数据处理等方面有更高的要求。 chart.setOption({ color: [ " ["username"]=> string(3) "cmt" ["tagsname"]=> string(0) "" ["tagsid"]=> string(2) "[]" ["catesname"]=> string(0) "" ["catesid"]=> string(2) "[]" ["createtime"]=> string(10) "1511396549" ["_id"]=> string(3) "419" } } ["count"]=> int(200) } 222 在wordpress添加自制html页面 - 爱码网

在wordpress添加自制html页面

POTUS

一、如何把自己单独做的HTML页面放到基于 WordPress 的网站上?

方法一：

1、将 xx.html 修改为 page-xx.php 上传到你当前使用的主题目录中；
2、在WordPress后台创建别名为 xx 的页面后发布，大功告成。

注意：创建的页面别名一定要与page-后面一样。或者在步骤1中将xx改为你的页面ID。

二、添加”钢材理论重量计算“页面代码：

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
</head>
<body>
<!-- 钢材比重按7.85计算-->
<div class="text clearfix" style="text-align:center;">
    <span style="font-size:25px;color:black;" >钢材理论重量计算</span><br><br></div><HR>
1、【方钢】      输入边宽:<input type="text" id="a1" autocomplete="off" style="width:50px"/>毫米；
                  <input type="button" id="submit1" value="计算" style="margin: 0 auto;";/>
                  <input type="text" id="count1" autocomplete="off" style="width:50px"/>KG/M<br><br><HR>
2、【圆角方钢】    输入边宽:<input type="text" id="a2" autocomplete="off" style="width:50px"/>毫米；
          输入圆角半径:<input type="text" id="r2" autocomplete="off" style="width:50px"/>毫米；
                      <input type="button" id="submit2" value="计算" />
                      <input type="text" id="count2" autocomplete="off" style="width:50px"/>KG/M<br><br><HR>
3、【钢板、扁钢、钢带】输入宽度:<input type="text" id="a3" autocomplete="off" style="width:50px"/>毫米；
                      输入厚度<input type="text" id="h3" autocomplete="off" style="width:50px"/>毫米；
                             <input type="button" id="submit3" value="计算" />
                             <input type="text" id="count3" autocomplete="off" style="width:50px"/>KG/M<br><br><HR>
4、【圆角扁钢】    输入宽度:<input type="text" id="a4" autocomplete="off" style="width:50px"/>毫米；
          输入圆角半径:<input type="text" id="r4" autocomplete="off" style="width:50px"/>毫米；
              输入厚度<input type="text" id="h4" autocomplete="off" style="width:50px"/>毫米；
                     <input type="button" id="submit4" value="计算" />
                     <input type="text" id="count4" autocomplete="off" style="width:50px"/>KG/M<br><br><HR>
5、【钢管】      输入外径:<input type="text" id="a5" autocomplete="off" style="width:50px"/>毫米；
          输入壁厚:<input type="text" id="b5" autocomplete="off" style="width:50px"/>毫米；
                  <input type="button" id="submit5" value="计算" />
                  <input type="text" id="count5" autocomplete="off" style="width:50px"/>KG/M<br><br><HR>
6、【等边角钢】    输入边厚:<input type="text" id="a6" autocomplete="off" style="width:50px"/>毫米；
              输入边宽:<input type="text" id="b6" autocomplete="off" style="width:50px"/>毫米；
              输入内面圆角半径:<input type="text" id="r6" autocomplete="off" style="width:50px"/>毫米；
              输入端边圆角半径:<input type="text" id="R6" autocomplete="off" style="width:50px"/>毫米；
                      <input type="button" id="submit6" value="计算" />
                      <input type="text" id="count6" autocomplete="off" style="width:50px"/>KG/M<br><br><HR>
7、【不等边角钢】   输入边厚:<input type="text" id="a7" autocomplete="off" style="width:50px"/>毫米；
              输入长边宽:<input type="text" id="b7" autocomplete="off" style="width:50px"/>毫米；
              输入短边宽:<input type="text" id="c7" autocomplete="off" style="width:50px"/>毫米；<br><br>            
              输入内面圆角半径:<input type="text" id="r7" autocomplete="off" style="width:50px"/>毫米；
              输入端边圆角半径:<input type="text" id="R7" autocomplete="off" style="width:50px"/>毫米；
                      <input type="button" id="submit7" value="计算" />
                      <input type="text" id="count7" autocomplete="off" style="width:50px"/>KG/M<br><br><HR>
8、【工字钢】     输入高度:<input type="text" id="h8" autocomplete="off" style="width:50px"/>毫米；
              输入腿宽:<input type="text" id="b8" autocomplete="off" style="width:50px"/>毫米；
              输入腰厚:<input type="text" id="d8" autocomplete="off" style="width:50px"/>毫米；
              输入平均腿厚:<input type="text" id="t8" autocomplete="off" style="width:50px"/>毫米；  <br><br>                       
              输入内面圆角半径:<input type="text" id="r8" autocomplete="off" style="width:50px"/>毫米；
              输入端边圆角半径:<input type="text" id="R8" autocomplete="off" style="width:50px"/>毫米；
                      <input type="button" id="submit8" value="计算" />
                      <input type="text" id="count8" autocomplete="off" style="width:50px"/>KG/M<br><br><HR>
9、【槽钢】      输入高度:<input type="text" id="h9" autocomplete="off" style="width:50px"/>毫米；
              输入腿宽:<input type="text" id="b9" autocomplete="off" style="width:50px"/>毫米；
              输入腰厚:<input type="text" id="d9" autocomplete="off" style="width:50px"/>毫米；
              输入平均腿厚:<input type="text" id="t9" autocomplete="off" style="width:50px"/>毫米；  <br><br>                       
              输入内面圆角半径:<input type="text" id="r9" autocomplete="off" style="width:50px"/>毫米；
              输入端边圆角半径:<input type="text" id="R9" autocomplete="off" style="width:50px"/>毫米；
                      <input type="button" id="submit9" value="计算" />
                      <input type="text" id="count9" autocomplete="off" style="width:50px"/>KG/M<br><br><HR>
<div class="text clearfix" style="text-align:center;">
    <span style="font-size:20px;color:black;" >钢材比重默认按7.85计算。本页设计与制作：<a href="http://www.architect.wang">architect.wang</a></span><br><br></div>                        
</body>
<script>
function js(id){ return document.getElementById(id) }
js("submit1").onclick = function(){
    var a = js("a1").value;
    js("count1").value = (a*a)*(7.85*0.001);
}
js("submit2").onclick = function(){
    var a = js("a2").value;
    var r = js("r2").value;
    js("count2").value = (a*a-0.8584*r*r)*(7.85*0.001);
}
js("submit3").onclick = function(){
    var a = js("a3").value;
    var h = js("h3").value;
    js("count3").value = (a*h)*(7.85*0.001);
}
js("submit4").onclick = function(){
    var a = js("a4").value;
    var h = js("h4").value;
    var r = js("r4").value;
    js("count4").value = (a*h-0.8485*r*r)*(7.85*0.001);
}
js("submit5").onclick = function(){
    var a = js("a5").value;
    var b = js("b5").value;
    js("count5").value = (3.1416*b*(a-b))*(7.85*0.001);
}
js("submit6").onclick = function(){
    var a = js("a6").value;
    var b = js("b6").value;
    var r = js("r6").value;
    var R = js("R6").value;
    js("count6").value = (a*(2*b-a)+0.2146*(r*r-R*R*2))*(7.85*0.001);
}
js("submit7").onclick = function(){
    var a = js("a7").value;
    var b = js("b7").value;
    var c = js("c7").value;
    var r = js("r7").value;
    var R = js("R7").value;
    js("count7").value = (a*(1*b+1*c-a)+0.2146*(r*r-R*R*2))*(7.85*0.001);
}
js("submit8").onclick = function(){
    var h = js("h8").value;
    var b = js("b8").value;
    var d = js("d8").value;
    var t = js("t8").value;
    var r = js("r8").value;    
    var R = js("R8").value;
    js("count8").value = (h*d*1+2*t*(b-d)+0.8584*(r*r-R*R))*(7.85*0.001);
}
js("submit9").onclick = function(){
    var h = js("h9").value;
    var b = js("b9").value;
    var d = js("d9").value;
    var t = js("t9").value;
    var r = js("r9").value;    
    var R = js("R9").value;
    js("count9").value = (h*d*1+2*t*(b-d)+0.4292*(r*r-R*R))*(7.85*0.001);
}
</script>
</html>

 

笔记：

1.<HR>是分格线

 

2、若有js("count2").value = (a+b-c); 
此时需要写成：
 js("count2").value = (a*1+b*1-c)

不然a+b就成了a&b.

 

分类：

技术点：

相关文章：

猜你喜欢
相关资源
相似解决方案
热门标签
Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode