在 Wordpress 插件中使用 Javascript(jQuery) 脚本
有了前面的一篇文章《在 Wordpress 插件中使用样式表》,则本节《在 WP 插件中使用 Javascript》就好描述,也容易理解的多了。
1,插件的文件夹结构与前文相同。插件完成的功能前文已经述及,本节将加一个功能,当在文字上点击时,弹出一个窗口。本节示例也在前文示例的基础上开发。
本节的 JS 脚本放置在 js 文件夹下,文件名 script.js,内容如下:
jQuery(document).ready(function(){
//---------------
jQuery("#myalert").click(function()
{
alert("Hello, Wordpress and JQuery!");
});
//---------------
});
2,完整代码及其解释
本节还介绍了另一种往文章中加入 CSS 代码的方法,使用了 wp_print_styles 这个 API 事件,与 wp_register_style 和 wp_enqueue_style 函数配合,是更合乎标准的用法。
加入 JS 脚本的代码,与 CSS 很相似,本节以加入一段 JQuery 脚本为例。不熟悉 jQuery 的朋友可以先去学习以下 jQuery,以在代码中使用其强大的功能。
WP 插件中加入 JS 脚本的代码,也有 2 种方法,当然最好也是使用 wp_print_scripts API 配合 wp_register_script 和 wp_enqueue_script 为推荐的方法。
除过几个函数和部分代码有少许的差别外,插件的结构与上节一样,可以参照阅读。
代码执行的结果,就是在页面的 head 部分添加了以下 JS 代码:
<script type='text/javascript' src='http://……/wp-includes/js/jquery/jquery.js?ver=1.3.2'></script>
<script type='text/javascript' src='http://……/wp-content/plugins/test-css-js/js/script.js?ver=20100405'></script>
本例的完整代码如下,关键代码有注释:
<?php
/*
Plugin Name: Test_CSS_JS
Plugin URI: http://www
相关文档:
//各种尺寸
s += "\r\n网页可见区域宽:"+ document.body.clientWidth;
s += "\r\n网页可见区域高:"+ document.body.clientHeight;
s += "\r\n网页可见区域高:"+ document.body.offs ......
参考资料:《javascript权威指南第五版》
===============变量==============
1、javaScript是一种弱类型的语言,用var语句即可声明一个变量。
2、如果不用var语句声明而直接给一个变量赋值,那这个变量将被隐式声明为全局变量。
3、如果函数内部用var语句声明了一个与某全局变量同名的变量,则在函数中全局变量被屏蔽了 ......
1.HTML文档树形表示
2.Node[] Node.childNodes
//返回Node对象的所有字节点
3.Node.firstChild / lastChild /nextSibling(下一个兄弟节点) / previousSibling (上一个兄弟节点) / parentNode
属性
4.Node.appendChild() / removeChild() / replaceChil ......
javascript中setTimeout()函数
大家都知道javascript中的setTimeput()函数的作用,一般会用他来处理一些连续的事情,们先看一个例子:
<head>
<script>
function init()
  ......