如何向一个html页面中加入jquery插件？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何向一个html页面中加入jquery插件？相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html>
<html>
<head>
</head>
<title>测试母版页</title>
</head>
<body>
<div style="font-size: 24px; color: #000000; margin: 0px auto; text-align: center">BJS sharepoint</div>
<div style="font-size: 24px; color: #000000; margin: 0px auto; text-align: center">BJS sharepoint</div>
</body>
</html>
一般来说，常规的插件都是：
1，引入jquery文件
2、引入插件的js文件
3、引入插件的css文件（如果有）
4、根据插件的说明初始化插件就可以了 参考技术A <head> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>> </script> </head>
浏览器console中加入jquery，测试选择元素
一、chrome浏览器F12打开调试界面，在console中输入(firefox同样可以)：
var jquery = document.createElement(‘script‘); jquery.src = "http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js";//若调试页面是https的这里也修改为https. document.getElementsByTagName(‘head‘)[0].appendChild(jquery); jQuery.noConflict();
现在试试 $("a"),已经是jQuery了
二、jQuery定位元素小总
0 获取iframe（id或name为mainFrame）中的元素
$(window.frames["mainFrame"].document).find("#more_655").children(":first").click();
1 元素选择器
获取所有元素： $("*")
类似的，找id: $("#XX") ； 找class: $(".XX") ；找有两个class属性的元素： $(".XX.YY") ； 找元素: $("p")
2 元素属性选择器
找有href属性的： $("[href]") ;
找href属性是#的： $("[href=‘#‘]") ; 找href属性不是#的： $("[href!=‘#‘]") ;
找href属性以java开头的： $("[href^=‘java‘]") ; 找href属性以.jpg结尾的： $("[href$=‘.jpg‘]") ;
找href属性包含www的： $("[href*=‘www‘]") ;
3 元素定位（基本过滤器）选择器
第一个a元素：$("a:first")[0].href ； 最后一个p元素：$("p:last") ;
类似的, :even选择偶数 :odd选择奇数 :eq(3)选择第3个（从0开始） :gt(3)选择index大于3的 :lt(3)选择index小于3的
$("input:not(:empty)") 选择不为空的input
子元素过滤器选择器
$("ul li:nth-child(2)") 每个ul的第2个li(从1开始），类似的，:first-child :last-child
$("ul li:only-child") 若ul包含多个li,则不匹配。
4 内容过滤器选择器
$(":contains(‘XXX‘)") 包括XXX ； $(":empty") 选择空元素 ;
5 可见性过滤器选择器
$("p:hidden")选择隐藏的p元素 ；类似的$("table:visible")
6 表单选择器
$(":input")选择input元素；
$(":text")选择type=text的input元素； $(":file")选择type=file的input元素；$(":image")选择type=image的input元素；
类似的有， :password :radio :checkbox :submit :reset :button
$(":enabled")选择激活的input元素；
类似的有，:disabled禁用的，:selected选取的 :checked选中的input元素；
7 层级选择器
(直接子)子选择器： >（大于号）紧跟父子关系 如$("div > p")表示选择div下的直接层是p的节点。
（所有子）后代选择器： （空格） 包括子元素 、孙元素等
（相邻兄弟）相邻兄弟选择器 ：+（加号） 紧跟兄弟关系 如$("div + p")表示选择div同层的左右相邻的p节点。
（所有兄弟）一般兄弟选择器：~ （波浪线）任意距离兄弟关系 如$("div~p")表示选择div同层的p节点。
参考：https://blog.csdn.net/sinat_18831033/article/details/52059899
https://www.cnblogs.com/zjfjava/p/9155153.html
以上是关于如何向一个html页面中加入jquery插件？的主要内容，如果未能解决你的问题，请参考以下文章
ajax在WordPress中加载页面后如何触发jquery插件？
前端Vue框架 05 第三方插件(vuex: 组件间交互的(移动端), axios - 前后台(django): ajax, element-ui: 页面布局, jq+bs: jQuery+Boo