说到用JS写一个Chrome插件来搜索现成网页内容并替换，咱们其实得先了解下基本思路。一般呢，就是通过脚本访问页面中的DOM元素，找到特定字符串，然后用新内容替换它。比如平时点击“搜索替换”，就是这种思路。你可能会用到类似下面的代码片段：
function createjs(){
var fso, f1;
fso = new ActiveXObject("Scripting.FileSystemObject");
f1 = fso.CreateTextFile("e:\\js.js", true); // 文件路径可以自己定义或者通过参数传入
f1.WriteLine("js代码");
f1.WriteBlankLines(1);
f1.Close();
}
不过这个ActiveXObject是IE专用的，现代Chrome插件里，我们主要通过content script访问页面，利用标准的DOM方法来实现搜索替换，比如document.body.innerHTML.replace()。总之，结合Chrome插件的权限和API，你可以轻松地搜索特定网页内容，并且完成替换，简直就是“动动手指头”的事儿。
var strdomain = $.trim($("#Text1").val());
var qsData = {
'wd': strdomain,
'p': '3',
'cb': 'ShowDiv',
't': '1324113456725'
};
$.ajax({
async: false,
url: "http://suggestion.baidu.com/su",
type: "GET",
dataType: 'jsonp',
jsonp: 'jsoncallback',
data: qsData,
success: function(data) {
// 处理返回的搜索建议数据
}
});
这样一来，你的网站就能实时显示来自百度的搜索建议啦，好棒是不是！
<input id="searchInput" type="text" placeholder="输入关键词搜索..." />
<div id="results"></div>
var articles = ['JavaScript技巧', '百度搜索引入方法', '站内搜索实现思路'];
function searchKeyword() {
var keyword = document.getElementById('searchInput').value.trim();
var results = articles.filter(item => item.indexOf(keyword) !== -1);
var resultDiv = document.getElementById('results');
resultDiv.innerHTML = results.length ? results.join('<br>') : '没找到相关内容，真遗憾~';
}
window.onscroll = function() {
var searchBox = document.getElementById("z_s_wraa");
if(!searchBox) return;
var offsetTop = searchBox.offsetTop;
var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
if(scrollTop > offsetTop) {
searchBox.style.position = 'fixed';
searchBox.style.top = '0';
} else {
searchBox.style.position = 'static';
}
};
这样用户滑动页面时，搜索框就会自动跑到顶部，体验感大大提升！
用JS写Chrome插件搜索网页内容难吗?
嘿，完全不难啦！其实Chrome插件就是用JS写的，关键在于内容脚本（content script）如何访问网页内容。你只要熟悉DOM操作，比如用document.querySelector找元素，然后innerHTML替换，搞定！再配合manifest.json权限设置，简直小菜一碟，放轻松，跟着步骤走即可。
百度搜索建议功能怎么集成自己网站？
哇，这个超级实用呢！你只要调用百度“suggestion.baidu.com”接口，用JSONP请求形式拿数据，然后动态渲染到页面就行了。这样用户输入关键词时，马上弹出热门建议，感觉很专业！而且跟后台没啥关系，前端玩起来相当畅快。
站内搜索功能用JS怎么写才省事？
亲，最简单的方法就是用数组存储你想搜索的关键词或文章标题，用户输入后用filter函数过滤匹配内容。你别看代码短，这招性能杠杠的，轻轻松松把用户想找的内容找出来，效果还特别明显，很适合小型网站。
页面滚动时搜索框如何固定到顶部？
这很easy！只要监听window.onscroll事件，根据滚动距离动态给搜索框加个position: fixed; top:0;或者删掉这个属性就好。哇塞，这样搜索框就“黏”在顶部了，用户每次搜东西都方便，不用折来折去，简直不能更贴心啦！
添加评论